![](/img/trans.png)
[英]How can I close a jQuery dialog, when I click outside the actual dialog frame?
[英]How can I correctly close this JQuery dialog?
我絕對不是JavaScript和JQuery的新手,但遇到以下問題。
進入頁面后,我會看到以下對話框:
<div id="dialogReject" title="">
<table style="visibility: hidden;" id="rifiutaTable" border="0" class="standard-table-cls" style="width: 100%!important">
<tbody style="background-color: #ffffff;">
<tr>
<td style="font: 16px Verdana,Geneva,Arial,Helvetica,sans-serif !important">Inserire note di rifiuto</td>
</tr>
<tr>
<td>
<textarea style="visibility: hidden;" rows="5" cols="70" id="myRejectNote"></textarea>
</td>
</tr>
<tr>
<td>
<input class="bottone" readonly="readonly" type="text" value="Rifiuta" onclick="rifiuta()"/>
</td>
</tr>
</tbody>
</table>
</div>
我認為是通過此JQuery腳本創建的:
$(document).ready(function() {
larghezza = '950px';
lunghezza = '470px';
lunghezza2 = '530px';
$("#dialogReject").dialog({
autoOpen: false,
//width:'335px',
width:'600px',
modal: true,
show: {
effect: "blind",
duration: 500
},
hide: {
effect: "blind",
duration: 500
}
});
});
如您所見,此對話框包含2個由2個輸入標簽實現的按鈕,這些按鈕是:
<td style="text-align: right">
<input class="bottone" readonly="readonly" type="text" value="Annulla" onclick="javascript:window.close()"/>
<input class="bottone" readonly="readonly" type="text" value="Rifiuta" onclick="rifiuta()"/>
</td>
當用戶單擊Annulla按鈕時,我希望對話框關閉。
實際上,我嘗試使用window.close()函數,但是它不起作用。
我認為要關閉此對話框,我必須使用與用戶使用ESC鍵盤按鈕關閉帶有簡單動畫的對話框時執行的事件相同的事件。
但是我真的不知道該怎么做。 你能幫我做嗎?
特納克斯
嘗試$("#dialogReject").dialog( "close" );
有關更多信息,請閱讀https://api.jqueryui.com/dialog/
要綁定它,請更改
<input class="bottone" readonly="readonly" type="text" value="Annulla" onclick="javascript:window.close()"/>
至
<input id="closeDialog" class="bottone" readonly="readonly" type="text" value="Annulla"/>
並將其添加到以下位置: $("#dialogReject").dialog({ [..your code..] });
$("#closeDialog").click(function(){
$("#dialogReject").dialog( "close" );
})
您必須在JavaScript文件中監聽事件。
首先為您的關閉按鈕設置一個id,我在這里使用#closeButton:
$(document).ready(function() { larghezza = '950px'; lunghezza = '470px'; lunghezza2 = '530px'; $("#dialogReject").dialog({ autoOpen: false, //width:'335px', width:'600px', modal: true, show: { effect: "blind", duration: 500 }, hide: { effect: "blind", duration: 500 } }); $("#closeButton").click(function(){ $("#dialogReject").close(); }); });
正如Alex和kaz給出的答案一樣,$(“#dialogReject”)。close();
或者您也可以使用可以通過jquery創建的按鈕
buttons: {Rifiuta: funstion()
{
rifiuta()
},
Annulla: function() {
$( this ).dialog( "close" );
}
供參考: https : //jqueryui.com/dialog/#modal-confirmation
$( "#dialogReject" ).dialog({
autoOpen: open,
//width:'335px',
width:'600px',
modal: true,
show: { effect: "blind", duration: 500 },
hide: { effect: "blind", duration: 500 },
buttons: {Rifiuta: funstion()
{
rifiuta()
},
Annulla: function() {
$( this ).dialog( "close" );
}
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.