как узнать путь к доверенному сертификату openssl?
Селектора jQuery выбирают совпадающие элементы, которые существуют в DOM при выполнении кода и не динамически обновляются. Когда вы вызываете функцию, например .hover(), чтобы добавить обработчик событий, она добавляет их только к этим элементам. Когда вы выполняете вызов AJAX и заменяете раздел своей страницы, вы удаляете эти элементы с привязанными к ним обработчиками событий и заменяете их новыми элементами. Даже если эти элементы теперь соответствуют этому селектору, они не получают привязки обработчика события, потому что уже выполненный код.
Обработчики событий
В частности, для обработчиков событий (т. Е. .click()), вы можете использовать делегирование событий, чтобы обойти это. Основной принцип заключается в том, что вы привязываете обработчик событий к статическому (существует, когда страница загружается, не заменяется) элемент, который будет содержать весь ваш динамический (загруженный AJAX) контент. Вы можете узнать больше о делегировании событий в документации jQuery .
Для вашего обработчика событий click обновленный код будет выглядеть так:
$(document).on('click', "#click", function () {
$('#click').css({
"background-color": "#f00",
"color": "#fff",
"cursor": "inherit"
}).text("Open this window again and this message will still be here.");
return false;
});
Это привяжет обработчик события ко всему документу (поэтому он никогда не удаляется до выгрузки страницы), который будет реагировать на события Проблема возникает, когда вам нужно обрабатывать плагины jQuery Что касается привязок обработчика событий. Однако это еще не все, что вы делаете. Вы также инициализируете плагин jQuery (colorbox), и нет возможности делегировать их элементам. Вам придется просто называть эти строки снова, когда вы загрузили свой контент AJAX; самым простым способом было бы переместить их в отдельную именованную функцию, которую вы можете вызвать в обоих местах (при загрузке страницы и в обратном вызове AJAX click на элементе с свойством id в click. В идеале вы должны использовать что-то ближе к своим динамическим элементам в DOM (возможно, .hover(). В JavaScript нет реального события hover, jQuery просто предоставляет эту функцию как удобное сокращение для привязки обработчиков событий к событиям mouseenter и mouseleave. Однако вы можете использовать делегирование делегирования: $(document).on({
mouseenter: function () {
$(this).stop().animate({
width: xwidth * 3,
height: xheight * 3,
margin: -(xwidth / 3)
}, 200); //END FUNCTION
$(this).addClass('image-popout-shadow');
},
mouseleave: function () {
$(this).stop().animate({
width: xwidth,
height: xheight,
margin: 0
}, 200, function () {
$(this).removeClass('image-popout-shadow');
}); //END FUNCTION
}
}, '.image-popout img');
success): function initialiseColorbox() {
$(".iframe").colorbox({
iframe: true,
width: "1000px",
height: "500px"
});
$(".inline").colorbox({
inline: true,
width: "50%"
});
$(".callbacks").colorbox({
onOpen: function () {
alert('onOpen: colorbox is about to open');
},
onLoad: function () {
alert('onLoad: colorbox has started to load the targeted content');
},
onComplete: function () {
alert('onComplete: colorbox has displayed the loaded content');
},
onCleanup: function () {
alert('onCleanup: colorbox has begun the close process');
},
onClosed: function () {
alert('onClosed: colorbox has completely closed');
}
});
}