0

我有一个jquery 移动弹出窗口。我想在它打开后执行一些操作。问题在于事件:

$(document).ready(function () {  
    $("#alertsPopup1").bind({
        popupafteropen: function (event, ui) { alert('popup'); }
    });
});

这里在html中弹出:

 <div data-role="popup" data-corners="false" class="alertsPopup"
                id="alertsPopup1" data-theme="e" data-overlay-theme="b" class="ui-content">
                <p>
                    aaaa</p>
            </div>

我不明白问题是什么,它通过绑定没有问题(我在 Chrome 的控制台中测试过)。

我会很感激一些帮助。

4

1 回答 1

3

首先不要使用 jQuery Mobile 准备好的文档,有时它会在 jQuery Mobile 正确处理DOM. 在这里阅读为什么。

您应该使用正确的 jQuery Mobile 页面事件,而不是准备好文档。在上一个链接中阅读有关它们的更多信息。

如果可能的话,也可以使用委托事件绑定。基本上使用 on 函数来绑定事件并将其绑定到文档级别。委托事件绑定应该解决文档准备使用的问题,主要是因为它不关心弹出窗口是否存在/不存在于DOM.

Javascript:

$(document).on('pagebeforeshow', '#index', function(){ 
    $(document).on("popupafteropen", "#alertsPopup1",function( event, ui ) {
        alert('popup');
    });  
});

HTML:

<div data-role="page" id="index">       
    <div data-role="content">
        <a href="#alertsPopup1" data-rel="popup">Open Popup</a>
        <div data-role="popup" data-corners="false" class="alertsPopup"
        id="alertsPopup1" data-theme="e" data-overlay-theme="b" class="ui-content">
            <p>
                aaaa</p>
        </div>
    </div>
</div> 

工作示例:http: //jsfiddle.net/Gajotres/Jgajv/

于 2013-07-17T06:56:15.603 回答