в содержимом окна FancyBox не работает событие .click()
Создаю окно.
$(document).ready(function ()
{
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false // не выводить тайтл
});
});
в него грузится ХТМЛ форма добавления юзера. Пример: <input type="text" id="user_name" style="width:300px"/> <input type="text" id="user_password" style="width:300px"/> <input type="text" id="start_date" name="start_date" style="width:300px"/> <input type="submit" value="Добавить" onClick="AddNewUser();" id="add_button"/> В этой форме к полю <input type="text" id="start_date" name="start_date" style="width:300px"/> привязан плагин .datepicker() :
$(function() {
var DateFormat = {
nextText : "»", prevText : "«", currentText : "Today", monthNames : ["Январь",
"Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь",
"Декабрь"], monthNamesShort : ["Янв", "Фев", "Мар", "Апр", "Май", "Июн", "Июл", "Авг", "Сен",
"Окт", "Ноя", "Дек"], dayNames : ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг",
"Пятница", "Суббота"], dayNamesShort : ["Вос", "Пон", "Вто", "Сре", "Чет", "Пят", "Суб"],
dayNamesMin : ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"], dateFormat : "dd/mm/yy", firstDay : 0,
isRTL : false
};
$("#start_date").datepicker(DateFormat);
});
Событие .click() не работает, соответственно и модуль тоже. Иду дальше и для проверки я просто создаю событие .ckick() любой объект подгружаемый в модальное окно. На кнопку отправления данных в обработчик <input type="submit" value="Добавить" onClick="AddNewUser();" id="add_button"/> я вешаю событие
$(document).ready(function (){
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false // не выводить тайтл
});
$("#add_button").click(function(){
alert('рабоает!');
});
});
и опять не работает. Возникает вопрос - почему? Данные не в iframe и, по идее, все должно быть нормально, но увы это не так. Может ли быть причина в том, что я склеиваю код JS из разных файлов? т.е. у меня несколько
$(document).ready(function (){ ... });
|
Насколько мне известно, fancybox копирует указанный вами блок в свой контент, а значит что получается как бы создается новый элемент, а значит после открытия окна вам надо заново прописать обработчики.
У fancybox есть какое то событие которое указывает что окно загружено |
Событие называется вроде...
onComplete : function() {
(...)
}
... должно говорить что окно загружено и робота скрипта закончена. Но как компактно прописывать заново все обработчики? если их может быть куча... хм. |
$("#add_button").live('click', function(){
alert('работает!'); }); |
walik,
Работает! Спасибо. Выкладываю мой готовый вариант.
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false, // не выводить тайтл
onComplete: function(){
var DateFormat =
{
nextText : "»", prevText : "«", currentText : "Today", monthNames : ["Январь",
"Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь",
"Декабрь"], monthNamesShort : ["Янв", "Фев", "Мар", "Апр", "Май", "Июн", "Июл", "Авг", "Сен",
"Окт", "Ноя", "Дек"], dayNames : ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг",
"Пятница", "Суббота"], dayNamesShort : ["Вос", "Пон", "Вто", "Сре", "Чет", "Пят", "Суб"],
dayNamesMin : ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"], dateFormat : "dd/mm/yy", firstDay : 0,
isRTL : false
/*closeText : "Done", prevText : "Prev", nextText : "Next", currentText : "Today", monthNames : ["January",
"February", "March", "April", "May", "June", "July", "August", "September", "October", "November",
"December"], monthNamesShort : ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep",
"Oct", "Nov", "Dec"], dayNames : ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday",
"Friday", "Saturday"], dayNamesShort : ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], dateFormat : "mm/dd/yy", firstDay : 0,
isRTL : false*/
};
$("#dob").datepicker(DateFormat);
$("#start_date").datepicker(DateFormat);
$("#fire_date").datepicker(DateFormat);
}
});
|
| Часовой пояс GMT +3, время: 22:38. |