Jquery 模态对话框仅在第一次单击时显示

Question

以下代码仅适用于第一次点击事件。但是对于任何后续点击都不会发生任何事情。

<input type="submit" name="add" value="Add it" onClick="javascript:Add(); return false;">

function Add()
{
   $(function(){
    var dialogOpts = {
        width: 880,
        height: 270,
        minWidth: 880,
        minHeight: 270,
        maxWidth: 890,
        maxHeight: 300
    };
    $("#add").dialog(dialogOpts);
    });
 }

如果我从以下位置删除 return false：

<input type="submit" name="add" value="Add it" onClick="javascript:Add(); return false;">

我让它在 Firefox 上工作，但在 IE8 中，窗口显示一到两秒钟，然后消失（缓存清除和所有）。

我在这个网络上似乎有很多关于这个问题的例子，但我担心我对 jquery 太陌生，无法应用它们:(

非常感谢

Answer 1

写这个来实例化你的对话框：

$(function(){

    $diag = $("#add");
    var dialogOpts = {
        width: 880,
        height: 270,
        minWidth: 880,
        minHeight: 270,
        maxWidth: 890,
        maxHeight: 300,
        autoOpen: false
    };
    $diag.dialog(dialogOpts); // This instantiates the dialog once.
    //And then add this eventhandler:
    $("input[name='add']").click(function(){
       $diag.dialog('open');
    });
});

并删除所有内联 onclick 的东西 - 尽可能避免它...

Answer 2

你想删除你的一些代码:) "javascript:" 不是必需的

<input type="submit" name="add" value="Add it" onClick="Add();">

并且不需要 dom 准备好的部分

function Add()
{
    var dialogOpts = {
        width: 880,
        height: 270,
        minWidth: 880,
        minHeight: 270,
        maxWidth: 890,
        maxHeight: 300
    };
    $("#add").dialog(dialogOpts);
 }