对话关闭事件jquery移动无法正常工作

时间:2015-04-15 10:33:40

标签: events jquery-mobile dialog

我正在研究jQuery移动动态对话框。除了近距离活动,一切都很好。

$(document).ready(function () {
    $('#btnalert').click(function () {
        alert('click');
        msg('hello', 'info', function () {
            alert('call back function');// this line is not called
        });
        
    });

});

function msg(_msg, _title, _okCB) {
    try {
        if (_title == null || _title == undefined || _title == '') {
            _title = 'Information';
        }
        if (_msg == null || _msg == undefined || _msg == '') {
            _msg = 'Error found. Please contact your administrator.';
        }
        // Create it in memory
        var dlg = $("<div id=\"dlgAlert\" class=\"ui-corner-all ui-shadow\" data-close-btn=\"right\" />")
            .attr("data-role", "dialog")
            .attr("id", "dialog");

        var header = $("<div />")
            .attr("data-role", "header")
            .attr("role", "banner")
            .html("<h2>" + _title + "</h2>");

        var content = $("<div style=\"padding: 15px;\" />")
            .attr("data-role", "content")
            .append($("<p />").html(_msg));

        content.append("<div ><a class='dlgalert' href='#index' data-rel='back'  data-role=\"button\"    data-theme=\"c\" >Close</a></div>");

        dlg.append(header).trigger('create');
        dlg.append(content).trigger('create');

         dlg.appendTo($.mobile.pageContainer);

        $.mobile.changePage(dlg, {
            transition: "pop",
            role: "dialog",
            reverse: false
        });


    } catch (e) {
        alert(e);
    }

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet"/>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<a id="btnalert" data-role="button"> alert</a>

1 个答案:

答案 0 :(得分:1)

在您的函数中添加以下代码。点击这里DEMO

对话框只是显示对话框的页面。所以在这里你可以致电pagehide事件。

 dlg.on("pagehide",function(){
      alert("Dialog closed");
 });

或检查DEMO

dlg.off("pagehide").on("pagehide",function(){
   alert("Dialog closed");
});