Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.06.2019, 09:53
Профессор
Отправить личное сообщение для greenwar Посмотреть профиль Найти все сообщения от greenwar
 
Регистрация: 19.08.2010
Сообщений: 150

куда пропадает event ?
всем привет!

есть такой JQ-плагин - datepicker
и вызывается он кликом по полю:
$( function() {
    $( "#datepicker" ).datepicker();
  } );


так вот, если это делать внутри FancyBox-окна (FB), то после закрытия окна ($('#fb_div').hide())
этот календарь больше НЕ показывается

т.е. если так:
1. открыть FB
2. закрыть FB (.hide())
3. снова открыть FB
4. ткнуть в поле #datepicker
...то календаря нет

при этом вот так всё ок:
$('#datepicker').on('mousedown', function(e) {alert('aaaa');});


а вот так опять нет:
$('#datepicker').on('mousedown', function(e) {
    $( '#datepicker' ).datepicker();
});

т.е. работает только в первый раз

как найти и починить косяк??

Последний раз редактировалось greenwar, 06.06.2019 в 10:00.
Ответить с цитированием
  #2 (permalink)  
Старый 06.06.2019, 10:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 30,152

Сообщение от greenwar
FancyBox
создаёт "окна" при открытии, они новые каждый раз, ставить иницициализацию после открытия.
делайте макет.
Ответить с цитированием
  #3 (permalink)  
Старый 06.06.2019, 10:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 30,152

greenwar,
примерно так ...
$(/*  */).fancybox({
	afterShow : function( instance, current ) {
		$( "#datepicker" ).datepicker();
	}
});
Ответить с цитированием
  #4 (permalink)  
Старый 06.06.2019, 10:24
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,709

рони, что я сделал не так, оно работает и с
$(function() {
   $("#datepicker").datepicker();
});
https://codepen.io/Malleys/pen/XwwZvd
Ответить с цитированием
  #5 (permalink)  
Старый 06.06.2019, 10:34
Профессор
Отправить личное сообщение для greenwar Посмотреть профиль Найти все сообщения от greenwar
 
Регистрация: 19.08.2010
Сообщений: 150

рони, я не юзаю fancybox(), у меня свой
он просто делает .show() / .hide()

а полная конструкция такая (внутри FB):
$(function()
{
    $('#datepicker').datepicker();
});

т.е. после загрузки FB там вешается листенер...
а потом походу что-то его обрубает...
как бы понять - что?

Последний раз редактировалось greenwar, 06.06.2019 в 10:38.
Ответить с цитированием
  #6 (permalink)  
Старый 06.06.2019, 10:34
Профессор
Отправить личное сообщение для greenwar Посмотреть профиль Найти все сообщения от greenwar
 
Регистрация: 19.08.2010
Сообщений: 150

Сообщение от Malleys Посмотреть сообщение
рони, что я сделал не так, оно работает и с
$(function() {
   $("#datepicker").datepicker();
});
https://codepen.io/Malleys/pen/XwwZvd
эта магия походу только там и работает
перенёс в html-файл и нифига не видно FB...
Ответить с цитированием
  #7 (permalink)  
Старый 06.06.2019, 10:50
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,709

Сообщение от greenwar
эта магия походу только там и работает
Как будто вы не знаете, что оно не будет работать без соответствующей инициализации! Там или у вас!

Сообщение от greenwar
перенёс в html-файл и нифига не видно FB...
Так надо полностью все ресурсы перенести, которые я добавил...
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-bootstrap/0.5pre/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css">

<style>

html, body {
	height: 100%;
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.datepicker-container {
	z-index: 100000 !important;
}

</style>


<div style="display: none;" id="hidden-content">
	<input id="datepicker">
</div>

<button data-fancybox data-src="#hidden-content">
	Trigger the fancybox
</button>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>
<script>

$(function() {
   $("#datepicker").datepicker();
});


</script>


Сообщение от greenwar
у меня свой
он просто делает .show() / .hide()
Тогда ничего не должно мешать его работе... Элемент добавленный на страницу на который добавлен обработчик события никак не теряет обработчики... Элемент даже можно отсоединять от принявшего его документа (в jQuery с его ограниченными методами такое по моему нельзя сделать?) и с обработчиками ничего не происходит... Возможно у вас где-то происходит опасный вызов jQuery метода html, который заменяет содержимое... Тогда обработчики будут утеряны! Посмотрите, чтобы у вас не было такого опасного вызова при помощи jQuery!

UPD Ещё обнаружил такой ужас... если в jQuery вызвать на элементе метод off, то он удаляет все обработчики добавленные при помощи jQuery... без различия откуда обработчики были добавлены: вами или "плагином" (а плагины добавляют обработчики неявно, т. е. вы не видите в своем коде метод on, и соответственно думаете, что off выключит только ваши обработчики), поскольку jQuery не изолирует обработчики плагинов от обработчиков вашего приложения... (а laimas-то говорил нам, что библиотека как раз для новичков... всё просто и понятно... а тут столько не очевидностей... ) Проверьте, может вы где вызываете очистку от своих обработчиков при помощи метода off, заодним подчищая обработчики "плагина".

Последний раз редактировалось Malleys, 06.06.2019 в 11:21.
Ответить с цитированием
  #8 (permalink)  
Старый 06.06.2019, 11:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 30,152

Сообщение от Malleys
Ещё обнаружил такой ужас...
мне сложно это понять, я считаю что метод off нормально работает.
Сообщение от Malleys
рони, что я сделал не так,
если у вас ничего не удаляется, то почему что-то должно пропасть.
Ответить с цитированием
  #9 (permalink)  
Старый 06.06.2019, 11:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 30,152

greenwar,
делайте макет!
Ответить с цитированием
  #10 (permalink)  
Старый 06.06.2019, 14:01
Профессор
Отправить личное сообщение для greenwar Посмотреть профиль Найти все сообщения от greenwar
 
Регистрация: 19.08.2010
Сообщений: 150

Сообщение от Malleys
Так надо полностью все ресурсы перенести, которые я добавил...
ну конечно я всё добавил...
...всё, кроме этого:
<script src='https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js'></script>


ну да, заработало...
кстати, если вызван календарь и нажать на крест, то FB исчезает, а календарь остаётся...
а если нажать на background серый, то всё ок.

.off() есть такой вот:
$(FB_bg).off('mouseup');

(при нажатии на bg)
но его отключение ничего не меняет...

макет щас попробую...

Последний раз редактировалось greenwar, 06.06.2019 в 14:11.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как создать event, эмулирующий enter Artanis Events/DOM/Window 7 16.07.2019 06:40
Добавление/Перенос Event в Event FullCalendar CI_NAU Events/DOM/Window 0 08.02.2019 15:32
Игра-квест на JS, помогите разобраться в структуре m_lulu Общие вопросы Javascript 1 29.03.2018 14:02
Событие event в FireFox yambbkru Firefox/Mozilla 2 12.02.2013 16:19
event + setTimeout fsingle Events/DOM/Window 2 02.05.2012 08:07