我有很多对话框,我需要一个简单的关闭按钮解决方案。我真的不想写一大堆代码来关闭每一个。
我想使用class="btnDone"的所有按钮和链接,我想关闭的对话框。除了为每个对话框中的每个按钮的每个实例编写单独的函数之外,是否有更简单的方法来做到这一点?
下面是其中一个对话框代码的示例:
<script>
// increase the default animation speed to exaggerate the effect
$.fx.speeds._default = 1000;
$(function() {
$( "#forgotPassword" ).dialog({position:['middle',60],
open: function(event, ui) {
jQuery('.ui-dialog-titlebar-close').removeClass("ui-dialog-titlebar-close").html('<span style="float:right;"><img src="../images/x.png" /></span>');
},
dialogClass: 'ui-widget-shadow',
modal: true,
autoOpen: false,
width: '650px',
close: function(ev, ui) {$(this).close();}
});
$( ".forgotPasswordOpen" ).click(function() {
$( "#forgotPassword" ).dialog( "open" );
return false;
});
});
</script>
<div style="display:none">
<div id="forgotPassword">
<!--#include file="modal08.asp"-->
</div>
</div>
我如何写关闭函数与class="btnDone"?
你看过API了吗?就像打开一个
$( ".btnDone" ).click(function(){
$('.ui-dialog-content').dialog( "close" );
})
<script>
$( ".btnDone" ).click(function() {
$(this).parent().dialog( "close" );
});
</script>
<div id="forgotPassword">
<input type="button" class="btnDone" value="Done" />
</div>
<div id="forgotUsername">
<input type="button" class="btnDone" value="Done" />
</div>
假设按钮在对话框中,您需要做的就是调用按钮的.parent()来引用特定的对话框。
我以前没有使用过jQuery UI,所以不知道"close"是否是你传递给对话框来关闭它。
我想你是想用一个主按钮来关闭所有的对话框。如果每个对话框包含一个样式为.btnDone
的按钮,例如:
<div>
My great dialog
<button class="btnDone">Get outta here</button>
</div>
<div>
Another thought
<button class="btnDone">Close</button>
</div>
<div>
Check this out
<button class="btnDone">Away!</button>
</div>
您可以使用$('.btnDone').parent('div').dialog('close');
关闭或$('.btnDone').parent('div').hide();
隐藏所有对话框。