IE浏览器存在一个BUG,当你使用label的for属性达到点击label使对应的表单元素聚焦,label中的内容为图片时,IE浏览器下不起作用。

例如:

<input type="checkbox" id="a"><label for="a"><img src="..."></label> 

  我们希望得到的效果是:点击“中国银行”,复选框会被选上(或者取消)。在FireFox,CHROME等浏览器下是没有问题的,但是IE浏览器却不吃这套。

解决的办法是使用JS:

window.onload = function(){
if(document.all && navigator.appVersion.indexOf("MSIE")>-1 && navigator.appVersion.indexOf("Windows")>-1)
{
var a = document.getElementsByTagName("label");
for(var i=0,j=a.length;i<j;i++){
if(a[i].hasChildNodes && a[i].childNodes.item(0).tagName == "IMG")
{
a[i].childNodes.item(0).forid = a[i].htmlFor;
a[i].childNodes.item(0).onclick = function(){
var e = document.getElementById(this.forid);
switch(e.type){
case "radio": e.checked|=1;break;
case "checkbox": e.checked=!e.checked;break;
case "text": case "password": case "textarea": e.focus(); break;
}
}
}
}
}
}

用图片作为label,for属性IE下不起作用的更多相关文章

  1. angularjs 绑定多个属性到下拉框

    绑定下拉框 angularjs  代码: //活动下拉切换 $scope.activityChange = function () { var cards = new Array(); var url ...

  2. 重写TreeView,多层级节点下批量显示图片,图片支持缩略图和文件名列表切换,支持调用者动态匹配选中,支持外界拖入图片并添加到对应节点下

    1.先看下整体效果 2.前端代码 <UserControl x:Class="iPIS.UI.Base.Tree.ImageTreeControl" xmlns=" ...

  3. CSS属性操作/下

    CSS属性操作/下 1.伪类 anchor伪类 跟<a>/</a>有关:专用于控制链接的显示效果 a:link(没有接触过的链接),用于定义了链接的常规状态. a:hover( ...

  4. DedeCMS文章页去img图片width和height属性

    方法一:正则匹配去除 打开include/ arc.archives.class.php,查找代码: //设置全局环境变量 $this->Fields['typename'] = $this-& ...

  5. 绝对定位下margin的作用

    以前一直对绝对定位下的margin作用很模糊,今天细看一下 不使用top,left,margin等 <!DOCTYPE html> <html lang="en" ...

  6. linux下mnt目录作用

    linux下mnt目录作用 一.mount 英文解释 登上; 爬上; 攀登; 骑上; 乘上; 跨上 可直接理解为“挂载” 挂接光驱.USB设备的目录,加载后,会在mnt里多出相应设备的目录.mnt是m ...

  7. 转 /etc/ld.so.conf.d/目录下文件的作用

    在了解/etc/ld.so.conf.d/目录下文件的作用之前,先介绍下程序运行是加载动态库的几种方法:第一种,通过ldconfig命令    ldconfig命令的用途, 主要是在默认搜寻目录(/l ...

  8. jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

    jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

  9. xmlHttpRequest在Firefox下不起作用?

    描述: XMLHttpRequest 在IE下正常,在Firefox下不起作用. 原因: XMLHttpRequest 对象的 onreadystatechange 不会在Firefox下执行, 解放 ...

随机推荐

  1. tplink路由器DMZ设置

    设置完成后,DMZ主机访问不了? 请排查以下方面: 1.确认服务器搭建成功,即内网可以正常访问: 2.确认在DMZ主机中填写的服务器IP地址正确: 3.宽带直接连接服务器并配置上网,确认外网可以正常访 ...

  2. Solr数据迁移

    单机Solr部署在linux /opt目录下,运行一段时间后发现该目录分配的空间不足,而Solr的索引数据量较大,必须更改相关core下面的data目录,以改变索引存放的目录. 找到相应的solrco ...

  3. gateway + jwt 网关认证

    思路: 全局过滤器对所有的请求拦截(生成token有效期30分钟,放入redis设置有效期3天.3天之类可以通过刷新接口自动刷新,超过3天需要重新登录.) 前端在调用接口之前先判断token是否过期( ...

  4. 为VisualStudio2017添加bits/stdc++.h

    在算法编程中经常有人只写一个头文件"bits/stdc++.h" 其实这个是很多头文件的集合,写了它后相当于包含了所有常用的C++头文件,可是需要注意的是并不是所有的OJ系统都支持 ...

  5. html5降龙十八掌-函数,对象,数组的练习

    <script>    function x1(){ var gj={};        gj.name="侯伟东";        gj.hp=500;       ...

  6. 创建servlet程序知识点详解---servlet-day03

    #1.表单包含有中文参数值,如何处理? ##(1)为什么会有乱码? 表单提交时,浏览器会对中文参数值进行编码/ 注:会按照表单所有的页面打开时所使用的字符集进行编码 比如,浏览器会使用utf-8对中文 ...

  7. Servlet+纯java+MySQL实现课程信息的增删改查

    Dbutil: package com.zh.util; import java.sql.Connection; import java.sql.DriverManager; import java. ...

  8. 【题解】Luogu P2730 魔板

    蒟蒻的第一道蓝题--好像也没有蓝的程度 一篇无STL的超弱题解(入门写法无误了QAQ 传送门 很经典的一道BFS 这是初始状态. 操作A 操作B 操作C 思路1 不使用cantor展开的情况 1. 对 ...

  9. vue_elementUI_ tree树形控件 获取选中的父节点ID

    el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID想要获取选中父节点的id;需要如下操作1. 找到工程下的node_m ...

  10. Linux统计系统文件类型出现的次数

    awk '/^UUID/{fs[$3]++}END{for(i in fs) {print i,fs[i]}}' /etc/fstab /^UUID/ 匹配确定行范围