У меня довольно странная проблема с jQuery/Javascript. (Это происходит в IE, FF и Chrome)
У меня есть веб-страница (asp.net) следующим образом:
Заголовок с множеством кнопок (сгенерирован в PreRender)
Скрытый div с кнопками, выполняющими postbacks (сгенерированный OnLoad) и div для использования в качестве диалога
Страница с iFrame
Допустим, у меня есть кнопка с '1234_stuff'
как ее CLIENTID в скрытом div. У меня есть кнопка в заголовке, которая имеет OnClientClick = "$('#1234_stuff').click();return false;";
Когда я нажимаю кнопку, которая находится в заголовке, это работает отлично. Хорошо.
У меня есть другая кнопка в заголовке (позволяет вызвать PopupStarter), у которой есть OnClientClick = "Popup('Titel', 'Description', '1234_stuff');return false;";
Функция всплывающего окна javascript выглядит следующим образом:
function Popup(title, description, buttonid) {
$('#dialog-popupText').html('<p><b>' + title + '</b></p><p>' + description + '</p>');
var buttonsToShow;
if (buttonid!= null) {
buttonsToShow = {
'ClickMe': function () {
$('#' + buttonid).click();
$(this).dialog('close');
},
'Cancel': function () {
$(this).dialog('close');
}
}
} else {
buttonsToShow = {
'Cancel': function () {
$(this).dialog('close');
}
}
}
$('#dialog-popup').dialog(
{
resizeable: false,
width: 'auto',
modal: true,
draggable: false,
buttons: buttonsToShow
});
}
Когда я нажимаю кнопку "PopupStarter", диалог jQuery показывает, как ожидалось, никаких проблем. Однако... когда я нажимаю кнопку ClickMe, ничего не происходит (кроме закрытия диалога).
Я думаю, что я сделал что-то не так: поэтому я попробовал это с помощью таймера:
function Popup(title, description, buttonid) {
$('#dialog-popupText').html('<p><b>' + title + '</b></p><p>' + description + '</p>');
var buttonsToShow;
if (buttonid!= null) {
buttonsToShow = {
'ClickMe': function () {
setTimeout(""$('#"" + buttonid + ""').click();"", 100);
$(this).dialog('close');
},
'Cancel': function () {
$(this).dialog('close');
}
}
} else {
buttonsToShow = {
'Cancel': function () {
$(this).dialog('close');
}
}
}
$('#dialog-popup').dialog(
{
resizeable: false,
width: 'auto',
modal: true,
draggable: false,
buttons: buttonsToShow
});
}
Это работает!! Теперь это странно. Поэтому я назвал родительский jQuery
parent.$('#' + buttonid).click();
Это также не работает.
И чтобы все это произошло, когда я ввожу каждую из строк вручную в консоли браузера, все они работают!
Попробуйте использовать это:
$(document).on('click', '#' + buttonid, function(){
Your functions here;
});
Любые элементы, которые не существуют при загрузке страницы, должны будут использовать прослушиватели событий для документа, тела или любого родительского селектора, существовавшего в DOM при загрузке страницы. Javascript не подключает слушателей к объектам, которые отсутствуют при загрузке DOM. Надеюсь это поможет!