jquery對話框以新舊內容打開

點擊打開對話框時，會顯示新舊內容。如果我添加$(this).dialog("destroy");，則根本無法打開對話框。請讓我知道如何不顯示舊內容。jquery對話框以新舊內容打開

<script> 
//display dialog box 
$("#dialog-message").dialog({ 
    autoOpen: false, 
    modal: false, 
    draggable: true, 
    resizable: true, 
    show: 'blind', 
    hide: 'blind', 
    width: 900, 
    dialogClass: 'ui-dialog-osx', 
    buttons: { 
     "I've read and understand this": function() { 
      $(this).dialog("close"); 
     } 
    } 
}); 

//click to open dialog box 
$("#test").click(function() { 
    $("#dialog-message").dialog("open"); 
} 
</script> 

<p id="test">test</p> 
<div id="dialog-message" title="Important information"> 
<form> </form> 
</div>

來源

2016-11-21 tenzin

只需添加一個內容載體，並改變對捕獲點擊事件的內容是這樣的：

//display dialog box 
 
$("#dialog-message").dialog({ 
 
    autoOpen: false, 
 
    modal: false, 
 
    draggable: true, 
 
    resizable: true, 
 
    show: 'blind', 
 
    hide: 'blind', 
 
    width: 400, 
 
    dialogClass: 'ui-dialog-osx', 
 
    buttons: { 
 
     "I've read and understand this": function() { 
 
      $(this).dialog("close"); 
 
     } 
 
    } 
 
}); 
 

 
//click to open dialog box 
 
$("#old-content").click(function() { 
 
    $('#dialog-message .content').text('This is the old content'); 
 
    $('#dialog-message').dialog('open'); 
 
}); 
 

 
$("#new-content").click(function() { 
 
    $('#dialog-message .content').text("Some new content"); 
 
    $('#dialog-message').dialog('open'); 
 
});

<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> 
 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 

 
<button id="old-content">Old content</button> 
 
<button id="new-content">New content</button> 
 
<div id="dialog-message" title="Important information"> 
 
    <div class="content"></div> 
 
</div>

來源

2016-11-21 22:36:36

謝謝Christos，它工作正常。 – tenzin

@Christos Lytras你可以好好檢查一下這個http://stackoverflow.com/questions/40830724/how-to-open-external-page-in-jquery-dialog-box-with-javascripts –

這是因爲你錯過了在代碼中右括號);。正確的片段是：

//click to open dialog box 
$("#test").click(function() { 
    $("#dialog-message").dialog("open"); 
});

我做了一個JSFiddle來演示它的工作原理。

JSFiddle

來源

2016-11-21 22:36:19 Hexodus

感謝Hexodus。這也有助於解決我的問題。 – tenzin

@tenzin我很高興有幫助。請不要忘記upvote;） – Hexodus

jquery對話框以新舊內容打開

回答

相關問題