javascript - jq的点击事件

Question

    <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元素会出现下面这样的情况要怎么解决

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

Answer 1

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

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

Answer 2

浏览器默认双击选中文本

Answer 3

双击默认选中文本

Answer 4

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

Answer 5

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> 

Answer 6

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

Answer 7

触发浏览器默认事件