原问题:

<td class="formValue" id="in-checkbox">
<label class="checkbox-inline">
<input type="hidden" name="allUserObj.execute" value="" id="allExecute"/>
    //type=“hidden”在前面,IE无法识别hidden类型,导致每次点击都是取它的值
<input type="checkbox" id="userAll" class="checkbox-blue" value=""/><b></b>所有用户
</label>
<label class="checkbox-inline">
<input type="checkbox" id="userOrgObj_checkbox" class="checkbox-blue" value="" checked="checked"/> <b></b>组织机构
</label>
<label class="checkbox-inline">
<input type="checkbox" id="assignUserObj_checkbox" class="checkbox-blue" value="" checked="checked"/><b></b>自定义用户
</label>
</td>
/*执行复选框勾选逻辑*/
$("#in-checkbox input").each(function(){
$(this).on("click",function(){
var state=$(this).prop("checked");
var type=$(this).val();
switch (type) {
case "":
if(state){
$("#in-checkbox input").prop("checked",false);
$("#in-checkbox input").prop("disabled","disabled");
$("#in-checkbox input").toggleClass("checkbox-blue",false).toggleClass("checkbox-disable",true);
$("#out-checkbox input").removeAttr("disabled");
$("#out-checkbox input").toggleClass("checkbox-blue",true).toggleClass("checkbox-disable",false);
$("#executeTr .contents").hide();
$(this).prop("checked",true);
$(this).removeAttr("disabled");
$(this).prev().removeAttr("disabled");
$(this).toggleClass("checkbox-blue",true).toggleClass("checkbox-disable",false);
$("#allExecute").val("true");
}else{
$("#in-checkbox input").prop("checked",true);
$("#in-checkbox input").removeAttr("disabled");
$("#in-checkbox input").toggleClass("checkbox-blue",true).toggleClass("checkbox-disable",false);
$("#out-checkbox input").prop("checked",false);
$("#out-checkbox input").prop("disabled","disabled");
$("#out-checkbox input").toggleClass("checkbox-blue",false).toggleClass("checkbox-disable",true);
$("#executeTr .contents").show();
$("#notExecuteTr .contents").hide();
$(this).prop("checked",false);
$("#allExecute").val("false");
}
break;
case "":
if(state){
$("#allExecute").val("false");
$("#orgInTr").show();
$("#orgOutTr").hide();
$("#out-checkbox input").eq().prop("checked",false);
$("#out-checkbox input").eq().prop("disabled","disabled");
$("#out-checkbox input").eq().toggleClass("checkbox-blue",false).toggleClass("checkbox-disable",true); $("#userAll").prop("checked",false);
}else{
$("#out-checkbox input").eq().removeAttr("disabled");
$("#out-checkbox input").eq().toggleClass("checkbox-blue",true).toggleClass("checkbox-disable",false); $("#orgInTr").hide();
}
break;
case "":
if(state){
$("#allExecute").val("false");
$("#userInTr").show();
$("#userOutTr").hide();
$("#out-checkbox input").eq().prop("checked",false);
$("#out-checkbox input").eq().prop("disabled","disabled");
$("#out-checkbox input").eq().toggleClass("checkbox-blue",false).toggleClass("checkbox-disable",true); $("#userAll").prop("checked",false);
}else{
$("#out-checkbox input").eq().removeAttr("disabled");
$("#out-checkbox input").eq().toggleClass("checkbox-blue",true).toggleClass("checkbox-disable",false); $("#userInTr").hide();
}
break;
default:
break;
}
});
});

 

  在IE下点击第一个所有对象不起效果,原因就在于IE无法识别hidden类型导致点击的时候总是先取hidden类型的值,所以var type=$(this).val();始终为空。而其他浏览器可以识别hidden类型,所以没有问题。

  解决方式:将隐藏域hidden类型放到后面即可

<td class="formValue" id="in-checkbox">
<label class="checkbox-inline">
<input type="checkbox" id="userAll" class="checkbox-blue" value=""/><b></b>所有用户
<input type="hidden" name="allUserObj.execute" value="" id="allExecute"/>//放到后面即可
</label>
<label class="checkbox-inline">
<input type="checkbox" id="userOrgObj_checkbox" class="checkbox-blue" value="" checked="checked"/> <b></b>组织机构
</label>
<label class="checkbox-inline">
<input type="checkbox" id="assignUserObj_checkbox" class="checkbox-blue" value="" checked="checked"/><b></b>自定义用户
</label>
</td>

  自己写段代码测试下:

<html>
<head>
<meta charset="utf-8">
<title>无标题页</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript" language="javascript">
$(function(){
$('#preview input').click(function(){
var menu_id = $(this).val();
confirm(menu_id);
})
})
</script>
</head>
<body>
<a id="preview" href="javascript:void(0)">
<label>预览
<input type="hidden" value=""> <!-- IE下弹0,input框不选中 -->
<input type="checkbox" value=""></input> <!-- 谷歌火狐下弹2,input框选中 -->
</label>
<label>编辑
<input type="hidden" value=""> <!-- IE下弹1,input框不选中 -->
<input type="checkbox" value=""></input> <!-- 谷歌火狐下弹3,input框选中 -->
</label>
</a>
</body>
</html>

  hidden类型放于下面IE下即可正常。

补充:

  需要注意一点的是:当隐藏域放在隐藏的元素里时,哪怕根据id去获取隐藏域的值,也是获取不到的,所以需要将隐藏域放到隐藏的元素外面。所以将隐藏域放在显示的input后面也不是明智之举,如果涉及到隐藏的情况的话就会影响到获取值。

IE浏览器无法直接识别input的type="hidden"问题的更多相关文章

  1. Input:type属性

    1.button:定义可点击的按钮(通常与 JavaScript 一起使用来启动脚本). <input id="" type="button" name= ...

  2. js修改input的type属性问题(兼容所有浏览器,主要用于密码类的默认有提示文字的效果)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  3. select2取值报错,Failed to read the 'selectionDirection' property from 'HTMLInputElement': The input element's type ('hidden') does not support selection.

    用到了 select2 组件来多选收件人,用搜狗浏览器(6.2版高速模式)在执行到如下这句时报错(Uncaught InvalidStateError: Failed to read the 'sel ...

  4. input的type属性的修改

    记录一下成长的历程吧! 刚开始写,没什么文笔,也没什么技术含量,可能主要的是纪录一下平常工作学习中遇到的问题,以及解决的办法吧.或者只有问题,没有解决办法. 前两天项目中遇到的一个问题,由于之前一直没 ...

  5. input的type属性

    input的type属性:http://www.w3school.com.cn/tags/att_input_type.asp 基本语法: <input type="hidden&qu ...

  6. 【HTML5】input元素type属性值

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. chrome、firefox表单自动提交诱因 -- 非type=hidden的单输入域(input)

    开发任务中遇到很费解的一个form自动提交问题,form中只有一个input时回车会触发自动提交表单,当在多一个非type=hidden的input时,又不会出现表单自动提交. 代码示例: 会出现自动 ...

  8. type为number的<input>标签 type和size属性失效

    html5中input的type属性增的可取值新增几种,对于不支持这几种新增值的浏览器会统一解析为text类型. Firefox.ie9不支持

  9. HTML5学习笔记简明版(5):input的type超级类型

    HTML5为input的type类型添加了多种枚举值,用来表达不同的意思.同事具有验证功能,假设格式不正确,浏览器将原始提供错误提示,堪称超级牛X啊,详细例如以下: Keyword Data type ...

随机推荐

  1. JAVAEE——SSH项目实战05:用户注册、登陆校验拦截器、员工拜访客户功能和MD5加密

    作者: kent鹏 转载请注明出处: http://www.cnblogs.com/xieyupeng/p/7170519.html 一.用户注册   显示错误信息到页面上的另一种方法: public ...

  2. Python csv模块的使用

    1.csv简介 CSV (Comma Separated Values),即逗号分隔值(也称字符分隔值,因为分隔符可以不是逗号),是一种常用的文本 格式,用以存储表格数据,包括数字或者字符.很多程序在 ...

  3. session效验

    看代码... <?php $servername = "服务器名"; $username = "账户名"; $password = "密码&qu ...

  4. [ 原创 ] Java基础6--构造函数和抽象类的性质

    构造函数的性质 // A.方法名与类名相同: // B.没有返回类型(例如return.void等):// C.不能被static.final.native.abstract和synchronized ...

  5. 下载 ....aar jitpack.io 打不开。

    下载 ....aar aar 是 安卓的 打包. 相对与jar 就是可以打包android的资源 比如res下的 . ------ jitpack.io  打不开. ====== 这个是jcenter ...

  6. Codeforces Round #254 (Div. 1) D. DZY Loves Strings hash 暴力

    D. DZY Loves Strings 题目连接: http://codeforces.com/contest/444/problem/D Description DZY loves strings ...

  7. XMOJ 1133: 膜拜大牛 计算几何/两圆相交

    1133: 膜拜大牛 Time Limit: 1 Sec  Memory Limit: 131072KiBSubmit: 9619  Solved: 3287 题目连接 http://acm.xmu. ...

  8. 洛谷OJ P2356 弹珠游戏 维护前缀和

    题目描述 Description MedalPluS 和他的小伙伴 NOIRP 发掘了一个骨灰级别的游戏--超级弹珠. 游戏的内容是:在一个 n*n 的矩阵里,有若干个敌人,你的弹珠可以摧毁敌人,但只 ...

  9. org.springframework.orm.hibernate3.LocalSessionFactoryBean

    Spring整合hibernate在配置sessionFactory时, 启动总是报出javax.transaction.TransactionManager找不到. 原因是:缺少jar包,jta-1 ...

  10. HTML5学习笔记4

    10.表单元素表单元素用于获取用户的输入数据form 表示HTML表单属性:    action 表示表单提交的页面    method 表示表单提交的请求方式:有POST和GET两种,默认GET(P ...