在IE浏览器中，当input获得焦点时，点击有unselectable="on"属性的标签时，不会触发onblur事件。

加上该属性的元素不能被选中。

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
< html>     
     < head>
          < title>html的标签unselectable=on属性的作用</title>
         < meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    < /head>
  <body>
  <div>
   < p><input id="txt" type="text"/></p>
 < p><span unselectable="on">unselectable="on"</span></p>
 < p><span unselectable="">span测试2 unselectable=""</span></p>
 
 < p><div unselectable="on">div测试1 unselectable="on"</div></p>
 < p><div unselectable="">div测试2 unselectable=""</div></p>
  </body>
< /html>
< script language="javascript" type="text/javascript">
    (function () {
        var txt = document.getElementById("txt");
        txt.onblur = function () { alert('失去焦点了'); }
    })();
< /script>

在IE下给DIV设置unselectable与onselectstart属性，可以让div的内容不能选中，这个功能在很多情况下，非常有用，但是他的bug太明显，

直接使用一个DIV是可以的，比如：

  1. <div unselectable="on" onselectstart="return false;">不能选中的内容</div>

但是假如在这个DIV前面在出现一个普通的DIV，那就有问题了，比如：

  1. <div>普通DIV<div>
  2. <div unselectable="on" onselectstart="return false;">从前面一个DIV开始选，就可以选中本部分内容，只有从该DIV结束部分才能不选中</div>

目前我还没找到很好的解决方案，要么在body里用onselectstart="return false;"，但是那会导致整个页面都无法选中；或者在所有div或者类似DIV的容器里都要设置onselectstart="return false;"，才能彻底解决。

Firefox下的解决方案：

style="-moz-user-select:none;"

Chrome下的解决方案：

style="-webkit-user-select:none;"

html的标签中 unselectable=on 属性的作用的更多相关文章

  1. meta标签中的http-equiv属性使用介绍（转载）

    meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言, ...

  2. <c:out>标签中的escapeXML属性

    <c:out>标签中的escapeXML属性 在<c:out>中,escapeXML属性默认为true. 当设置escapeXML的属性为true时,将value中的值以字符串 ...

  3. spring property标签中的 ref属性和ref 标签有什么不同？ 如下：<property name="a" ref="b" />

    spring property标签中的 ref属性和ref 标签有什么不同? 如下:<property name="a" ref="b" /> sp ...

  4. [转]spring property标签中的 ref属性和ref 标签有什么不同

    spring property标签中的 ref属性和ref 标签有什么不同? 如下:<property name="a" ref="b" /> sp ...

  5. 关于meta标签中的http-equiv属性使用介绍

    关于meta标签中的http-equiv属性使用介绍 meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标 ...

  6. 【转】meta标签中的http-equiv属性使用介绍

    meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言, ...

  7. 标签中的name属性和ID属性的区别

    标签中的name属性和ID属性的区别 2018年05月13日 10:17:44 tssit 阅读数:760   编程这么久,细想了一下,发现这个问题还不是很清楚,汗!看了几篇文章,整理了一下,分享下! ...

  8. Meta标签中的format-detection属性及含义(转)

    一.Meta标签中的format-detection属性及含义 意为:格式检测 或许你会有这样的经历:当你在制作手机端的页面中,点击了没有加任何链接的格式的数字时,这时手机会进行自动拔号提示操作! 禁 ...

  9. C++ CEF 浏览器中显示 Tooltip(标签中的 title 属性)

    在 Windows 中将 CEF 集成到 C++ 客户端以后,默认是无法显示 tooltip 的,比如图片标签中的 title 属性. 实现的方式其实很简单,按下面的步骤操作就可以: 创建一个文本文件 ...

随机推荐

  1. Android问题-打开DelphiXE8与DelphiXE10新建一个空工程提示"out of memory"

    错误信息: [DCC Error] E2597 d:\XE8\Embarcadero\Studio\16.0\PlatformSDKs\android-ndk-r9c\toolchains\arm-l ...

  2. spring注解使用

    一.各种注解方式 1.@Autowired注解(不推荐使用,建议使用@Resource) @Autowired可以对成员变量.方法和构造函数进行标注,来完成自动装配的工作.@Autowired的标注位 ...

  3. jquery easyui防止超出浏览器边界

    var easyuiPanelOnMove=function(left,top){ if(left<0){ $(this).window('move',{ left:1 }); } if(top ...

  4. Qt 自动搜索串口号列表

    @功能: SerialPortList 类实现当前可用的串口进行实时扫描,当发现有新的串口 或是现有串口消失时,SerialPortList类将发出一个QStringList类型的 信号onNewSe ...

  5. CodeForces 706C Hard problem (水DP)

    题意:对于给定的n个字符串,可以花费a[i]  将其倒序,问是否可以将其排成从大到小的字典序,且花费最小是多少. 析:很明显的水DP,如果不是水DP,我也不会做.... 这个就要二维,d[2][max ...

  6. 连接查询中on and和on where的区别

    一.区别 1. and条件是在生成临时表时使用的条件,它不管and中的条件是否为真,都会返回左(或者右)边表中的记录. 2.where条件是在临时表生成好后,再对临时表进行过滤的条件.这时已经没有le ...

  7. windows 下实现函数打桩：拦截API方式

    windows 下实现函数打桩:拦截API方式            近期由于工作须要,開始研究函数打桩的方法. 由于不想对project做过多的改动,于是放弃了使用Google gmock的想法. ...

  8. c#加密 可逆与不可逆MD5 加密

    1.方法一 (不可逆加密) srxljl public string EncryptPassword(string PasswordString,string PasswordFormat )     ...

  9. android访问webservices

    /** * 手机号段归属地查询(模拟器.HTC 可以) *  * @param phoneSec 手机号段 */ public  void getRemoteInfo() { /*String pho ...

  10. 从Wolframserver获取DC comics卡通人物数据

    背景知识 DC comics是美国时代华纳旗下DC娱乐下属的一个漫绘图书出版商. 超人.蝙蝠侠之类漫画的始作俑者. 在Wolfram的眼下为止3750个PopularCurves数据中(所有下载数据有 ...