#jquery #html #modal-dialog
#jquery #HTML #модальный диалог
Вопрос:
У меня есть организационная диаграмма с использованием slickmap.css, которую я изменил с помощью переключения показывать / скрывать. Все работает нормально, но теперь мне нужно добавить модальное диалоговое окно при нажатии и отображать информацию из тега a.
Мне удалось это сделать, но пришлось добавить значение return false, чтобы предотвратить выполнение действия переключения. Теперь, когда я отображаю информацию, она полностью удаляет тег a со страницы. Я думаю, что когда я добавляю html (this), он игнорирует возвращаемое значение false в конце.
Пожалуйста, кто-нибудь может помочь мне заставить эти две функции работать вместе.
Вот код, который я использую для вызова модального диалога, извините, я не опубликовал скрипку, но я думаю, что в этом и заключается проблема
$('#samplelink').click(function(){
$('#modal_window').dialog('open').html(this);
return false;
}); //end click handler
Комментарии:
1. Чего вы хотите достичь с помощью
.html(this)
? Вы ищете.html($(this).html())
?2. Спасибо, да, это сработало. Пожалуйста, вы можете сказать мне, почему это сработало. Также опубликуйте это как ответ, и я приму, приветствия
3. На самом деле я понимаю, почему это сработало, а у меня получилось только наполовину, спасибо 🙂
Ответ №1:
Вы не можете перейти this
к методу html().
Поскольку этот код находится внутри обработчика событий, this
это будет элемент DOM, обрабатывающий событие ( click
в нашем случае). html()
может принимать только строку или аргумент функции.
Если ваша цель — заполнить диалоговое окно содержимым #samplelink
, вам следует вызвать html()
текущий элемент без аргументов, а затем вызвать html()
диалоговое окно с результирующей строкой:
$("#samplelink").click(function() {
$("#modal_window").dialog("open").html($(this).html());
return false;
});
Комментарии:
1. Спасибо за объяснение, я понятия не имел, что присвоенное значение «this» может измениться, если оно находится внутри обработчика событий. Приветствия
Ответ №2:
Попробуйте :
$('#samplelink').click(function(){
$('#modal_window').dialog('open').html($(this).html());
return false;
}); //end click handler
Где $(this).html()
содержит допустимый HTML-код.
Вы могли бы попробовать быстро
$('#samplelink').click(function(){
$('#modal_window').dialog('open').html('<h1>Hello World</h1>');
return false;
}); //end click handler
Комментарии:
1. Спасибо, Дэвид, это был правильный ответ, Фредерик уже отвечал на него раньше в комментариях, вот почему я выбрал его, спасибо