jQuery Mobile $(“#popup”）.popup(“open”）;转换页面后不起作用

jQuery Mobile $("#popup").popup("open"); not working after transitioning pages

本文关键字：换页 转换 不起作用 open #popup Mobile jQuery popup      更新时间：2023-09-26

我有 2 个 JQM 页面和 1 个它们共享的弹出窗口。 我有一个绑定到两者的"pagecreate"的事件处理程序，其中包含如下代码：

$(document).on("pagecreate", "#home", function() {
    $("#cart-button").on("tap", function(event) {
        alert("home alerted");
        event.preventDefault();
        $("#cartContextMenu").popup("open", { x: event.pageX, y: event.pageY });
    });
});
$(document).on("pagecreate", "#cat-cart", function() {
    $("#cart-button").on("tap", function(event) {
        alert("cat cart alerted");
        event.preventDefault();
        $("#cartContextMenu").popup("open", { x: event.pageX, y: event.pageY });
    });
});

两个页面内的 HTML 弹出代码 JQM 页面标记：

<div data-role="popup" id="cartContextMenu" data-arrow="true">
    <a href="#cat-cart"><input class="create-a-new-order" data-icon="plus" type="button" value="Create Order" /></a>
    <a href="#cat-cart"><input data-icon="forward" type="button" value="4398230424" /></a>
    <a href="#cat-cart"><input data-icon="forward" type="button" value="4398230324" /></a>
    <a href="#cat-cart"><input data-icon="forward" type="button" value="CSOS8230948" /></a>
    <a href="#cat-cart"><input data-icon="forward" type="button" value="44948" /></a>
    <a href="#cat-cart"><input data-icon="forward" type="button" value="CFDXKJFJF" /></a>
</div>

当我单击/点击 #home 页面上的按钮时，弹出窗口显示正常...当我转换到购物车 #cat 并再次单击该按钮时，警报会触发，但不显示 JQM 弹出窗口。

我做错了什么？

答案很简单，每次点击事件都绑定到第一个按钮出现，即第 1 页。

在每个页面上都有一个不同的按钮。

相关文章：