单击第一次未绑定但在刷新页面后已绑定的事件



我遇到了一个奇怪的问题,一个标签的点击事件在第一次打开页面时不工作,但在刷新同一页面后工作正常。我检查了jquery审计,没有事件绑定的标签第一次,但点击事件绑定后刷新它。

代码条如下:

<head>
    ...
    <script src="http://dev.wenba.ca/static/js/jquery.2.js?v=20150409" type="text/javascript"></script>
    <script src="http://dev.wenba.ca/static/js/jquery.form.js?v=20150409" type="text/javascript"></script>
    <script src="http://dev.wenba.ca/static/mobile/js/app.js?v=20150409" type="text/javascript"></script>
   ...
</head>
...
<div class="aw-question-detail">
...
    <a class="aw-invite-replay" href="#"><i class="icon icon-inviteask"></i> <?php _e('invite reply'); ?></a>
...
</div>
...
在移动/js/app.js:

$(document).ready(function () {
...
    $('.aw-invite-replay').click(function()
    {
        alert("click invite reply");
        if ($(this).parents('.aw-question-detail').find('.aw-invite-box').is(':visible'))
        {
            $(this).parents('.aw-question-detail').find('.aw-invite-box').hide();
            $(this).removeClass('active');
        }else
        {
            $(this).parents('.aw-question-detail').find('.aw-invite-box').show();
            $(this).addClass('active');
        }
    });
...
});

根据你对这个问题的评论,我相信你的问题是在HTML上,而不是在你的脚本。确保在页面第一次加载时,.aw-invite-replay元素在DOM中。你可以用任何浏览器的开发工具来检查。

如果元素在那里,你也可以尝试将每个script标签移动到body的底部,如问题的评论所建议的

将js标签移动到body底部时效果良好。谢谢大家。

最新更新