[英]jQuery UI Modal Dialog Closes Immediately on JSP
我們正在從JSP打開一個簡單的jQuery UI對話框。
我們看到了片刻,然后立即關閉。 該對話框需要保持打開狀態。
JSP代碼:
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
function openPopUp() {
alert('OpenPopUp() called');
$("#dialog-1").dialog(
{
width: 600,
height: 400,
open: function(event, ui)
{
var textarea = $('<textarea style="height: 276px;">');
$(textarea).redactor({
focus: true,
maxHeight: 300,
});
}
});
}
</script>
在JSP的下面,單擊Div,然后打開彈出窗口的按鈕:
<html:html>
<div id="dialog-1" title="Dialog Title goes here..." style="display: none;">This my first jQuery UI Dialog!</div>
...
<button id="disregard_1" onclick="openPopUp();">Open Dialog</button>
</html:html>
您的初始化應為單獨的imo。 檢查jQuery UI上的API / 示例 ,更詳細地了解模態形式。
// init
var dialog = $('#selector').dialog({/*your options*/});
// bind event
$('#event-trigger').click(function(){
dialog.dialog('open');
});
總結一下您的情況:
// dom ready
$(function(){
var myPopup = $('#dialog-1');
// custom function
function openPopUp() {
alert('OpenPopUp() called');
myPopup.dialog('open');
}
// init
myPopup.dialog({
autoOpen: false, // prevent it from opening by default
width: 600,
height: 400,
open: function(event, ui){
var textarea = $('<textarea style="height: 276px;">');
$(textarea).redactor({
focus: true,
maxHeight: 300,
});
}
});
});
希望您看到初始化onClick和調用已初始化的內容之間的區別。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.