栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何使HTML文本不可选择

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何使HTML文本不可选择

用普通的HTML无法做到这一点,因此JSF在这里也无法为您做很多事情。

如果您仅针对体面的浏览器,则只需使用CSS3:

.unselectable {    -webkit-touch-callout: none;    -webkit-user-select: none;    -khtml-user-select: none;    -moz-user-select: none;    -ms-user-select: none;    user-select: none;}<label >Unselectable label</label>

如果您还想涵盖较旧的浏览器,请考虑以下Javascript后备:

<!doctype html><html lang="en">    <head>        <title>SO question 2310734</title>        <script> window.onload = function() {     var labels = document.getElementsByTagName('label');     for (var i = 0; i < labels.length; i++) {         disableSelection(labels[i]);     } }; function disableSelection(element) {     if (typeof element.onselectstart != 'undefined') {         element.onselectstart = function() { return false; };     } else if (typeof element.style.MozUserSelect != 'undefined') {         element.style.MozUserSelect = 'none';     } else {         element.onmousedown = function() { return false; };     } }        </script>    </head>    <body>        <label>Try to select this</label>    </body></html>

如果您已经在使用,那么这是另一个示例,它

disableSelection()
向jQuery添加了一个新函数,以便您可以在jQuery代码中的任何位置使用它:

<!doctype html><html lang="en">    <head>        <title>SO question 2310734 with jQuery</title>        <script src="http://pre.jquery.com/jquery-latest.min.js"></script>        <script> $.fn.extend({      disableSelection: function() {          this.each(function() {   if (typeof this.onselectstart != 'undefined') {      this.onselectstart = function() { return false; };  } else if (typeof this.style.MozUserSelect != 'undefined') {      this.style.MozUserSelect = 'none';  } else {      this.onmousedown = function() { return false; };  }         });      }  }); $(document).ready(function() {     $('label').disableSelection();  });        </script>    </head>    <body>        <label>Try to select this</label>    </body></html>


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/420828.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号