类似问题:如何将带有id的自定义按钮添加到对话框模式的jquery对象
我很好奇是否有人知道我如何使用添加到.html正文中的自定义按钮关闭jQuery对话框。我应该更改onClick值吗?什么?也许虚拟逃生钥匙是一种选择。我不想使用标题栏关闭或按钮窗格关闭,这样我就可以保留我正在进行的主题。谢谢
这是我所拥有的:
<script>
$(function () {
var $dialog = $('<div></div>')
.html('')
.dialog({
autoOpen: false,
modal: true,
position: 'center',
draggable: false,
width:'40%';
$(".ui-dialog-titlebar").hide()
$("body").on('click', '#opener', function(e) {
var param = $(this).attr('data-AttrRatingID');
$dialog.html(param + "<br /><div id='modalClose' onclick='' class='formbtnshell' title='Close'><div class='formbtnwhtl'></div><div class='formbtnwhtr'></div><div class='formbtninside formbtninsidedelete'><div class='formbtntext'>Close</div></div></div>");
$dialog.dialog('open');
// prevent the default action, e.g., following a link
return false;
});
});
只需分配一个点击事件并close
事件内的对话框。避免使用内联事件处理程序。
$(document).on('click', '#modalClose', function() {
$(dialogSelector).dialog('close');
});
更新
你创造小提琴的方式有一些问题。永远不要嵌套事件。它会多次绑定事件,但不会获得所需的效果。
您正在将事件附加到id=opener$("body").on('click', '#opener',
但是当您将元素添加到时,元素的id是不同的
// Declare the initial dialog outside the Click event
var $dialog = $('#dialogg');
$dialog.dialog({
autoOpen: false,
modal: true,
position: 'center',
draggable: false,
width: '40%',
buttons: {
"Close": function () {
$(this).dialog("close")
}
}
});
// Append the HTML and open the dialog
$('input').click(function () {
$dialog.html("<br /><a id='modalClose'>CloseMe</a>");
$dialog.dialog('open');
});
// Bind the click event that closes the modal
$("body").on('click', '#modalClose', function (e) {
// prevent the default action, e.g., following a link
e.preventDefault();
// Need to close the Modal
$dialog.dialog('close');
});
检查Fiddle$dialog.html("
CloseMe");