1

我正在尝试构建 Jquery Dialog 以在屏幕上显示多个弹出窗口，但有时 OK 按钮不执行任何操作。

function alert_popup_msg(_msg)
{
   var id = "" + (new Date()).getTime();
   var popDiv = "<div id='" + id + "' class=\"dialog-size def-popup\"><div  class=\"popup-background\"><label class=\"color-white no-text-shadow center-align font-helv-16-bold std-padding-a\">Alert</label><label class=\"color-white no-text-shadow center-align font-helv-12-reg std-padding-a\">"+_msg+"</label><div class=\"center-align\"><a class=\"btn-simple-black-orange btn-text btn-login\" id=\"okButtonCallBack\">Ok</a></div></div></div> ";                                             
   $.mobile.activePage.append(popDiv).trigger("pagecreate");

   $( "#" + id ).dialog({
      modal: false,

    });
   $("#okButtonCallBack").click(function(event){
            $("#" + id).dialog("close");
            $("#" + id).remove();
   });

};

谁能帮我解决这个问题？它阻止用户执行任何操作。即使您导航返回并返回同一屏幕，除非您刷新整个屏幕，否则仍会显示弹出窗口。

谢谢，拉梅什

4

3 回答 3

0

您的 ok 按钮不应有 id，而应通过 CSS 类指定，因为根据定义，ID 是唯一的，并且您的代码当前会因多个对话框而中断（因为$("#example")总是会返回第一个结果）。

于 2013-10-11T21:50:00.137 回答
0

更改id="okButtonCallBack"为class="okButtonCallBack"，因为 ID 必须是唯一的。然后编写处理程序：

$(document).on("click", ".okButtonCallBack", function() {
    var dialog = $(this).closest(".def-popup");
    dialog.dialog("close").remove();
}

该处理程序可以只指定一次，不需要在alert_popup_msg函数中绑定。

于 2013-10-11T21:50:07.607 回答
0

使用on而不是click，我可以建议不要在 ID 属性中使用 ID，您当时不需要超过 1 个对话框。

body这将“侦听”与类匹配的节点更改，并在将回调插入 DOM 时将其dialog-ok-button绑定到事件。click因此无需多次重新运行此代码。

$('body').on('click', '.dialog-ok-button', function(event){
    $(".dialog").dialog("close");
    $(".dialog").remove();
});
于 2013-10-11T21:52:51.710 回答