Javascript pageinit中的单击事件仅在页面刷新后起作用

我知道有很多重复的问题，我检查了几乎所有的问题，但我就是找不到解决我的问题的办法。所以，我的问题是：

我有一个横幅，它将显示在项目的每个页面上，在横幅内有一个关闭按钮来关闭横幅，还有一个下载按钮，它将用户引导到应用商店下载应用程序。我的横幅工作完美，除了我必须刷新页面，使这两个按钮的工作。这是我的密码：

$(document).on("pageinit", function () {
    $("#close").on("click", CloseBanner);
    $("#download").on("click", SetAppStorePath);
    //alert("pageinit");
});

function SetAppStorePath() {
    if (isIOS) {
        window.location = "https://itunes.apple.com/us/app/myapp/id.....";
}
    else if (isAndroid) {
    window.location = "https://play.google.com/store/apps/details?id=.....";
    }
}

function CloseBanner() {
    $('.banner').hide();
}

以下是简化的html：

<div class="banner">
    <div class="container">
        <a id="close">&times;</a>
        <a id="download">Download</a>
    </div>
</div>

&时代；
下载

我做了一个小测试，发现了一些棘手的问题：我在pageinit中添加了这个警报，我注意到当我从a页跳转到B页时，警报总是被执行（意味着我的点击事件按钮总是被注册）。但是当按钮工作时，我看到a页消失了，空白页显示，警报显示，然后B页显示，按钮工作。当它不工作时，顺序不同，我仍然可以看到A页，然后我看到警报（我现在仍然可以看到A页），然后它变为B页，按钮不工作

---

所以，当页面跳转之后执行pageinit时，它似乎可以工作，但有时在页面跳转之前执行pageinit时，它就不工作了

我认为您的元素是动态创建的。您可能需要活动授权

$(document).on("pagecreate", function () {
    $("body").on("click", "#close", CloseBanner);
    $("body").on("click", "#download", SetAppStorePath);
});

---

我认为您的元素是动态创建的。您可能需要活动授权

$(document).on("pagecreate", function () {
    $("body").on("click", "#close", CloseBanner);
    $("body").on("click", "#download", SetAppStorePath);
});

---

将following移到init之外，并将其更改为following

$(document).on("click","#close", CloseBanner);
$(document).on("click","#download", SetAppStorePath);

---

执行page init时，DOM未就绪。这就是它不绑定到关闭或下载元素的原因。这就是克服这一点的方法。您不需要在此处使用pageinit事件

将下面的内容移动到init之外，然后像下面一样更改它

$(document).on("click","#close", CloseBanner);
$(document).on("click","#download", SetAppStorePath);

---

执行page init时，DOM未就绪。这就是它不绑定到关闭或下载元素的原因。这就是克服这一点的方法。你不需要这里的pageinit事件

我昨天试过这个，它不起作用。我还记得有人建议在pageinit上使用，而不是为jQuery mobile准备文档？我认为您的元素是动态创建的。您可能需要活动授权。请参阅更新的答案@Yabinsong我想我的元素不是动态创建的。。不管怎么说，我只是尝试了另一个答案，它是有效的，所以我只是接受了它。我稍后会试试你的，谢谢你。：）嗨，我今天尝试了你的解决方案，我遇到了同样的问题，它在真正的设备上不起作用。按钮坏了。你知道这里出了什么问题吗？我不知道为什么它不起作用。您可以尝试

pagecreate

而不是

pageinit

。请参阅更新的答案@YabinSongI昨天试过这个，它不起作用。我还记得有人建议在pageinit上使用，而不是为jQuery mobile准备文档？我认为您的元素是动态创建的。您可能需要活动授权。请参阅更新的答案@Yabinsong我想我的元素不是动态创建的。。不管怎么说，我只是尝试了另一个答案，它是有效的，所以我只是接受了它。我稍后会试试你的，谢谢你。：）嗨，我今天尝试了你的解决方案，我遇到了同样的问题，它在真正的设备上不起作用。按钮坏了。你知道这里出了什么问题吗？我不知道为什么它不起作用。您可以尝试

pagecreate

而不是

pageinit

。请参阅更新的答案@YabinSong@YabinSong：感谢的方式是，接受并投票：）嗨@Chamika Sandamal，昨天我尝试了这个解决方案，当我在chrome中测试它时，它是有效的。今天我在真正的设备上测试了它，它不起作用。我的意思是按钮完全不起作用。奇怪的是它在chrome虚拟设备上工作。。。当我使用上面的旧代码时，真正的设备可以工作。你知道问题出在哪里吗？@YabinSong:这里表示感谢的方式是，接受并投票：）嗨@Chamika Sandamal，昨天我尝试了这个解决方案，当我在chrome中测试它时，它是有效的。今天我在真正的设备上测试了它，它不起作用。我的意思是按钮完全不起作用。奇怪的是它在chrome虚拟设备上工作。。。当我使用上面的旧代码时，真正的设备可以工作。你知道问题出在哪里吗？所以我昨天尝试了一个公认的答案，它在chrome虚拟设备中运行良好。但今天当我在真正的设备上测试它时，按钮完全不起作用。希望有人能指出这里出了什么问题。谢谢。所以我昨天尝试了这个被接受的答案，它在chrome虚拟设备中运行良好。但今天当我在真正的设备上测试它时，按钮完全不起作用。希望有人能指出这里出了什么问题。谢谢