blocks|key|353234|text|我解决了。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|353235|我使用销毁而不是关闭函数(它没有任何意义)，但它工作。|353236|$(document).ready(function()+{
$('#showTerms').click(function()
{
++++$('#terms').css('display','inline');
++++$('#terms').dialog({resizable:+false,
++++++++modal:+true,
++++++++width:+400,
++++++++height:+450,
++++++++overlay:+{+backgroundColor:+"#000",+opacity:+0.5+},
++++++++buttons:{+"Close":+function()+{+$(this).dialog('**destroy**');+}+},
++++++++close:+function(ev,+ui)+{+$(this).close();+},
++++});+++++++++
});+++
$('#form1+input#calendarTEST').datepicker({+dateFormat:+'MM+d,+yy'+});
});|code-block|syntax|javascript|353237|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I solved it.
I used destroy instead close function (it doesn't make any sense), but it worked.
<pre><code>$(document).ready(function() {
$('#showTerms').click(function()
{
 $('#terms').css('display','inline');
 $('#terms').dialog({resizable: false,
 modal: true,
 width: 400,
 height: 450,
 overlay: { backgroundColor: &quot;#000&quot;, opacity: 0.5 },
 buttons:{ &quot;Close&quot;: function() { $(this).dialog('**destroy**'); } },
 close: function(ev, ui) { $(this).close(); },
 }); 
}); 
$('#form1 input#calendarTEST').datepicker({ dateFormat: 'MM d, yy' });
});
</code></pre>

blocks|key|3351376|text|实际上，您应该使用$("#terms").dialog({+autoOpen:+false+});来初始化它。然后，您可以使用$('#terms').dialog('open');打开对话框，使用$('#terms').dialog('close');关闭它。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3351377|entityMap^0|9|14|1R|R|2Q|S|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|O|8|@]|D|@]|E|$]]]|G|$]]

You're actually supposed to use <code>$("#terms").dialog({ autoOpen: false });</code> to initialize it.
Then you can use <code>$('#terms').dialog('open');</code> to open the dialog, and <code>$('#terms').dialog('close');</code> to close it.

blocks|key|353225|text|在最后一行，不要使用$(this).remove()，而要使用$(this).hide()。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|353226|编辑:为了澄清，在close+click事件中，您将从DOM中删除#terms+div，这就是它不会返回的原因。你只需要把它隐藏起来。|353227|entityMap^0|A|G|V|E|0|X|6|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|R|8|@]|D|@]|E|$]]]|I|$]]

on the last line, don't use <code>$(this).remove()</code> use <code>$(this).hide()</code> instead.

EDIT: To clarify,on the close click event you're removing the <code>#terms</code> div from the DOM which is why its not coming back. You just need to hide it instead.

blocks|key|3138583|text|我相信你只能初始化对话框一次。上面的示例在每次单击#terms时都会尝试初始化对话框。这会带来问题。相反，初始化应该在click事件之外进行。您的示例可能如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3138584|$(document).ready(function()+{
++++//+dialog+init
++++$('#terms').dialog({
++++++++autoOpen:+false,
++++++++resizable:+false,
++++++++modal:+true,
++++++++width:+400,
++++++++height:+450,
++++++++overlay:+{+backgroundColor:+"#000",+opacity:+0.5+},
++++++++buttons:+{+"Close":+function()+{+$(this).dialog('close');+}+},
++++++++close:+function(ev,+ui)+{+$(this).close();+}
++++});
++++//+click+event
++++$('#showTerms').click(function(){
++++++++$('#terms').dialog('open').css('display','inline');++++++
++++});
++++//+date+picker
++++$('#form1+input#calendarTEST').datepicker({+dateFormat:+'MM+d,+yy'+});
});|code-block|syntax|javascript|3138585|我在想，一旦你弄清楚了这一点，它应该会解决你所描述的“从链接打开”的问题。|3138586|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I believe you can only initialize the dialog one time. The example above is trying to initialize the dialog every time #terms is clicked. This will cause problems. Instead, the initialization should occur outside of the click event. Your example should probably look something like this:

<pre><code>$(document).ready(function() {
 // dialog init
 $('#terms').dialog({
 autoOpen: false,
 resizable: false,
 modal: true,
 width: 400,
 height: 450,
 overlay: { backgroundColor: "#000", opacity: 0.5 },
 buttons: { "Close": function() { $(this).dialog('close'); } },
 close: function(ev, ui) { $(this).close(); }
 });
 // click event
 $('#showTerms').click(function(){
 $('#terms').dialog('open').css('display','inline'); 
 });
 // date picker
 $('#form1 input#calendarTEST').datepicker({ dateFormat: 'MM d, yy' });
});
</code></pre>

I'm thinking that once you clear that up, it should fix the 'open from link' issue you described.

blocks|key|3138670|text|对我来说，这种方法是可行的：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3138671|通过单击对话框上的X或单击“注意”，可以关闭该对话框。我添加了一个(任意的)+id，因为我需要确保添加到dom中的每一点html都会在之后被删除。|3138672|$('<div+id="dossier_edit_form_tmp_id">').html(data.form)
.data('dossier_id',dossier_id)
.dialog({
++++++++title:+'Opdracht+wijzigen',
++++++++show:+'clip',
++++++++hide:+'clip',
++++++++minWidth:+520,
++++++++width:+520,
++++++++modal:+true,
++++++++buttons:+{+'Bewaren':+dossier_edit_form_opslaan+},
++++++++close:+function(event,+ui){+
++++++++++++++++++++++++++++++++++$(this).dialog('destroy');+
++++++++++++++++++++++++++++++++++$('#dossier_edit_form_tmp_id').remove();
+++++++++++++++}
});|code-block|syntax|javascript|3138673|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

For me this approach works: 

The dialog may be closed by clicking the X on the dialog or by clicking 'Bewaren'. I'm adding an (arbitrary) id because I need to be sure every bit of html added to the dom is removed afterwards.

<pre><code>$('&lt;div id="dossier_edit_form_tmp_id"&gt;').html(data.form)
.data('dossier_id',dossier_id)
.dialog({
 title: 'Opdracht wijzigen',
 show: 'clip',
 hide: 'clip',
 minWidth: 520,
 width: 520,
 modal: true,
 buttons: { 'Bewaren': dossier_edit_form_opslaan },
 close: function(event, ui){ 
 $(this).dialog('destroy'); 
 $('#dossier_edit_form_tmp_id').remove();
 }
});
</code></pre>

blocks|key|354614|text|+<button+onClick="abrirOpen()">Open+Dialog</button>

<script+type="text/javascript">
var+$dialogo+=+$("<div></div>").html("Aqui+tu+contenido(here+your+content)").dialog({
+++++++title:+"Dialogo+de+UI",
+++++++autoOpen:+false,
+++++++close:+function(ev,+ui){
+++++++++++++++$(this).dialog("destroy");
+++++++}
+function+abrirOpen(){
+++++++$dialogo.dialog("open");
+}
});

//**Esto+funciona+para+mi...+(this+works+for+me)**
</script>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|354615|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code> &lt;button onClick="abrirOpen()"&gt;Open Dialog&lt;/button&gt;

&lt;script type="text/javascript"&gt;
var $dialogo = $("&lt;div&gt;&lt;/div&gt;").html("Aqui tu contenido(here your content)").dialog({
 title: "Dialogo de UI",
 autoOpen: false,
 close: function(ev, ui){
 $(this).dialog("destroy");
 }
 function abrirOpen(){
 $dialogo.dialog("open");
 }
});

//**Esto funciona para mi... (this works for me)**
&lt;/script&gt;
</code></pre>

blocks|key|358011|text|这是一个超级古老的帖子，但由于答案甚至说“它没有任何意义”，我想我应该加上答案……|type|unstyled|depth|inlineStyleRanges|entityRanges|data|358012|最初的post使用了$(+this+).remove()；在关闭处理程序中，这实际上会从DOM中删除对话框div。再次尝试初始化对话框不起作用，因为div已被删除。|358013|使用$(this).dialog('+destroy+')将调用对话框对象中定义的方法destroy，该方法不会将其从DOM中删除。|358014|从文档中：|358015|358016|销毁()|blockquote|358017|358018|完全删除对话框功能。这将使元素返回到其>>pre-init状态。此方法不接受任何参数。|358019|也就是说，只有在有充分理由的情况下，才能在关闭时销毁或删除。|358020|entityMap^0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|U|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|V|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|J|5|K|7|X|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|Z|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|10|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|R|$]]

This is a super old thread but since the answer even says "It doesn't make any sense", I thought I'd add the answer...

The original post used $(this).remove(); in the close handler, this would actually remove the dialog div from the DOM. Attempting to initialize a dialog again wouldn't work because the div was removed.

Using $(this).dialog('destroy') is calling the method destroy defined in the dialog object which does not remove it from the DOM.

From the documentation:

<blockquote>
 destroy()
 
 <blockquote>
 Removes the dialog functionality completely. This will return the element back to its >>pre-init state.
 This method does not accept any arguments.
 </blockquote>
</blockquote>

That said, only destroy or remove on close if you have a good reason to.

blocks|key|3351360|text|$(this).dialog('destroy');|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|3351361|成功了！|unstyled|3351362|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>$(this).dialog('destroy');
</code></pre>

works!

blocks|key|357930|text|.close()更通用，可以在引用更多对象时使用。.dialog('close')只能与对话框一起使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|357931|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

.close() is mor general and can be used in reference to more objects. .dialog('close') can only be used with dialogs

blocks|key|355352|text|我将对话框用作对话文件浏览器和上传器，然后重写代码，如下所示|type|unstyled|depth|inlineStyleRanges|entityRanges|data|355353|var+dialog1+=+$("#dialog").dialog({+
++++++++++++++autoOpen:+false,+
++++++++++++++height:+480,+
++++++++++++++width:+640+
});+
$('#tikla').click(function()+{++
++++dialog1.load('./browser.php').dialog('open');
});+++|code-block|syntax|javascript|355354|一切似乎都运行得很好。|355355|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I use the dialog as an dialog file browser and uploader then I rewrite the code like this

<pre><code>var dialog1 = $("#dialog").dialog({ 
 autoOpen: false, 
 height: 480, 
 width: 640 
}); 
$('#tikla').click(function() { 
 dialog1.load('./browser.php').dialog('open');
}); 
</code></pre>

everything seems to work great.

blocks|key|3138740|text|我在jquery-ui+overlay对话框中遇到了同样的问题-它只能工作一次，然后就会停止，除非我重新加载页面。我在他们的一个例子中找到了答案-|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3138741|同一页面上的多个覆盖|3138742|flowplayer_tools_multiple_open_close|offset|length|3138743|3138744|谁会这样做，对吧？？:-)+-+|unordered-list-item|3138745|3138746|重要的设置似乎是|3138747|oneInstance:+false|code-block|syntax|javascript|3138748|所以，现在我有了这样的想法-|3138749|$(document).ready(function()+{

+var+overlays+=+null;

+overlays+=+jQuery("a[rel]");

+for+(var+n+=+0;+n+<+overlays.length;+n%2B%2B)+{

++++$(overlays[n]).overlay({
++++++++oneInstance:+false,+
++++++++mask:+'#669966',
++++++++effect:+'apple',
++++++++onBeforeLoad:+function()+{
++++++++++++overlay_before_load(this);
++++++++}
++++});

++}

}|3138750|一切都很好|3138751|希望这对某些人有帮助|3138752|O。|3138753|entityMap|0|LINK|mutability|MUTABLE|url|http://flowplayer.org/tools/demos/overlay/multiple.html^0|0|0|0|10|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1B|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1C|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|1D|8|@]|9|@$F|1E|G|1F|1|1G]]|A|$]]|$1|H|3|-4|5|6|7|1H|8|@]|9|@]|A|$]]|$1|I|3|J|5|K|7|1I|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|1J|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|1K|8|@]|9|@]|A|$]]|$1|O|3|P|5|Q|7|1L|8|@]|9|@]|A|$R|S]]|$1|T|3|U|5|6|7|1M|8|@]|9|@]|A|$]]|$1|V|3|W|5|Q|7|1N|8|@]|9|@]|A|$R|S]]|$1|X|3|Y|5|6|7|1O|8|@]|9|@]|A|$]]|$1|Z|3|10|5|6|7|1P|8|@]|9|@]|A|$]]|$1|11|3|12|5|6|7|1Q|8|@]|9|@]|A|$]]|$1|13|3|-4|5|6|7|1R|8|@]|9|@]|A|$]]]|14|$15|$5|16|17|18|A|$19|1A]]]]

I had the same problem with jquery-ui overlay dialog box - it would work only once and then stop unless i reload the page. I found the answer in one of their examples - 
Multiple overlays on a same page 
<a href="http://flowplayer.org/tools/demos/overlay/multiple.html" rel="nofollow">flowplayer_tools_multiple_open_close</a> 
 - who would have though, right?? :-) - 

the important setting appeared to be 

<pre><code>oneInstance: false
</code></pre>

so, now i have it like this - 

<pre><code>$(document).ready(function() {

 var overlays = null;

 overlays = jQuery("a[rel]");

 for (var n = 0; n &lt; overlays.length; n++) {

 $(overlays[n]).overlay({
 oneInstance: false, 
 mask: '#669966',
 effect: 'apple',
 onBeforeLoad: function() {
 overlay_before_load(this);
 }
 });

 }

}
</code></pre>

and everything works just fine

hope this helps somebody

O.

blocks|key|3138625|text|jQuery文档中有一个指向本文“Basic+usage+of+the+jQuery+UI+dialog”的链接，该文章解释了这种情况以及如何解决这种情况。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3138626|entityMap|0|LINK|mutability|MUTABLE|url|http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/^0|H|Z|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

The jQuery documentation has a link to this article 
'<a href="http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/" rel="nofollow noreferrer">Basic usage of the jQuery UI dialog</a>'
that explains this situation and how to resolve it.

I have a problem with the <a href="https://jqueryui.com/dialog/" rel="nofollow noreferrer"><code>jquery-ui dialog box</code></a>. 

The problem is that when I close the dialog box and then I click on the link that triggers it, it does not pop-up again unless I refresh the page. 

How can I call the dialog box back without refreshing the actual page. 

Below is my code:

<pre><code>$(document).ready(function() {
 $('#showTerms').click(function()
 {
 $('#terms').css('display','inline');
 $('#terms').dialog({
 resizable: false,
 modal: true,
 width: 400,
 height: 450,
 overlay: { backgroundColor: "#000", opacity: 0.5 },
 buttons:{ "Close": function() { $(this).dialog("close"); } },
 close: function(ev, ui) { $(this).remove(); },
 }); 
});
</code></pre>

Thanks

jQuery UI Dialog Box - does not open after being closed

我对有点问题。问题是，当我关闭对话框，然后单击触发它的链接时，它不会再次弹出，除非我刷新页面。如何在不刷新实际页面的情况下回调对话框。下面是我的代码：$(document).ready(function() {    $('#showTerms').click(function()    {        $('#terms').css('display','inline');        $(

问jQuery UI对话框-关闭后不打开
EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery UI对话框-关闭后不打开EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery UI对话框-关闭后不打开
EN