Question

我有一个 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的控制台中测试过）。

我很感激一些帮助。

Answer 1

首先不要使用jQuery Mobile准备好文档，有时它会在jQuery Mobile在 DOM 内正确处理页面之前触发。阅读 here 原因。

您应该使用正确的jQuery Mobile页面事件，而不是文档准备就绪。在之前的链接中阅读有关它们的更多信息。

如果可能，还可以使用委托事件绑定。基本上使用函数来绑定事件并将其绑定到文档级别。委托事件绑定应解决文档就绪使用问题，主要是因为它不关心 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/

打开弹出后不起作用

1 个答案:

Javascript：

HTML：