Question

我有这个PAGE，如果你向下滚动地图，这里就是我的代码

HTML

<ul class="play_navigation">
    <li class="active"><a class="barino_story_bottom" href="#">The Story</a></li>
    <li><a class="barino_video_bottom" href="#">The Video</a></li>
    <li><a class="barino_gallery_bottom" href="#">The Gallery</a></li>
    <li><a class="barino_equipment_bottom" href="#">The Equipment</a></li>                          
</ul>

我的jQuery

<script type="text/javascript">
    $(document).ready(function(){
        $('.play_navigation a').click(function(){
            console.log("this is the click");
            return false;
        });
    });
</script>

如果点击链接，什么都没发生....你可以查看源代码并看到它...但是如果我将它粘贴到控制台中它工作正常......是什么给了

Answer 1

这个标记是异步添加到DOM的吗？在这种情况下，您需要使用live：

注意： .live已被弃用并在最新版本的jQuery中删除（有充分理由）。有关用法和解决方案，请参阅下面的事件委派策略。

<script>
    $(document).ready(function(){
        $('.play_navigation a').live('click', function(){
            console.log("this is the click");
            return false;
        });
    });
</script>

您能够重新运行脚本块并使其工作的事实告诉我，由于某种原因，在绑定时元素不可用或者在某些时候删除了绑定。如果绑定时不存在元素，则需要使用live（或最好使用事件委托）。否则，您需要检查代码以查找将删除绑定的其他内容。

使用jQuery 1.7事件委托：

$(function () {

    $('.play_navigation').on('click', 'a', function (e) {
        console.log('this is the click');
        e.preventDefault();
    });

});

如果您希望在文档准备好之前绑定事件，也可以将事件委托给文档（请注意，这也会导致jQuery检查每个单击事件以确定元素是否与相应的选择器匹配）：

$(document).on('click', '.play_navigation a', function (e) {
    console.log('this is the click');
    e.preventDefault();
});

Answer 2

您需要阻止默认事件（在链接之后），否则您的链接将加载新页面：

    $(document).ready(function(){
        $('.play_navigation a').click(function(e){
            e.preventDefault();
            console.log("this is the click");
        });
    });

正如评论中所指出的，如果您的链接没有href，那么它不是链接，请使用其他内容。

不工作？你的代码是MESS！和ready（）事件无处不在...清理它，将所有脚本放在一个准备好的事件中，然后再试一次，它很可能会解决问题。

Answer 3

我浪费时间在这上面几个小时。幸运的是，我找到了解决方案。如果您使用的是bootstrap管理模板（AdminLTE），则可能会出现此问题。我们必须使用adminLTE框架插件。

示例：ifChecked事件：

$('input').on('ifChecked', function(event){
   alert(event.type + ' callback');
});

了解更多信息click here。

希望它也能帮到你。

Answer 4

对某些人可能有用：检查

pointer-events: none;

在CSS中。它可以防止JS捕获点击。我认为这很重要，因为在这种情况下CSS可能是您最后要研究的地方。

jquery点击事件没有解雇？

4 个答案: