jq的点击事件

    <span>222</span>
    <span>222</span>
    <span>222</span>
    <span>222</span>
    <span>222</span>
    
    $(function() {
    for (var i = 0; i < $('span').length; i++) {
        $('span').eq(i).bind('click',function(event){
            console.log("aa");
        })
    };
}())

上面的代码,我连续点击某个span元素会出现下面这样的情况要怎么解决

clipboard.png

为什么会出现这样的东西,我用的是谷歌浏览器。麻烦知道的给解答下。谢谢

阅读 5.9k
7 个回答

连续点击会触发浏览器的文本选择行为,要阻止此行为,使用以下 css:

span {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

浏览器默认双击选中文本

双击默认选中文本

应该是双击的是触发的全选吧。。。浏览器自带的一些全选功能。。。

  1. 这是浏览器默认行为,建议找个成熟的 CSS Reset 样式表重置下默认样式;

  2. 事件监听应该不用这么麻烦,建议直接以委托形式绑到 document 下(好处是不用再等 ready 了):

<span>222</span>
<span>222</span>
<span>222</span>
<span>222</span>
<span>222</span>

<script>   
    $(document).on('click', 'span', function(event){
        console.log("aa");
        });
</script> 

这种情况是出现了默认事件 你需要阻止默认事件 return flase

触发浏览器默认事件

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题