• 解决Firefox/Opera 不支持onselectstart事件实现不允许用户select


    在IE/Safari/Chrome中我们可以使用onselectstart事件来阻止用户选定元素内文本,本文为大家解决下火狐中如何实现不能选择,由此需求的朋友可以参考下,希望对大家有所帮助
     
             在开发中,很多区域是不允许用户select的,在IE/Safari/Chrome中我们可以使用onselectstart事件来阻止用户选定元素内文本, 但在火狐中,这段区域还是可以选择的,
    如下:
    <html>
    <head>
    <meta charset="gbk">
    <title>Firefox/Opera不支持onselectstart事件</title>
    </head>
    <body>
    <div id="noselect">Text</div>
    <script type="text/javascript">
    var div = document.getElementById('noselect');
    div.onselectstart = function () {
    console.log(3);
    }
    </script>
    </body>
    </html> 

    当用鼠标去选定div内的文本时,IE/Safari/Chrome 的控制台输出了3,Firefox/Opera则没有输出。
    但是火狐有自己的css样式"-moz-user-select“
    我们可以使用它来禁止用户选择文本
    如下:

    <html>
    <head>
    <meta charset="gbk">
    <title>Firefox/Opera不支持onselectstart事件</title>
    <style type="text/css">
    #noselect
    {
    -moz-user-select: none;
    cursor: default;
    }
    </style>
    </head>
    <body>
    <div id="noselect" onselectstart="return false;">Text</div>
    </body>
    </html> 

    user-select是css3 的样式。

  • 相关阅读:
    Chrome快捷键统计
    数据封装
    数据抽象
    linux c++ 服务器端开发面试必看书籍(转载)
    闭包和高阶函数
    this,call,apply,bind
    DOM浏览器window对象模型
    jquery滚动条
    xml教程
    多态
  • 原文地址:https://www.cnblogs.com/webqiand/p/4602739.html
Copyright © 2020-2023  润新知