解决IE7中使用jQuery动态操作name问题


Posted in jQuery onAugust 28, 2017

问题:IE7中无法使用Jquery动态操作页面元素的name属性。

在项目中有出现问题,某些客户的机器偶尔会有,后台取不到前台的数据值。

然开发和测试环境总是不能重现问题。坑爹之处就在于此,不能重现就不能调试,就不能知道改了后还会不会有这样的问题。

想想可能与客户环境唯一不同就只有可能是js缓存问题了,然后把所有的js文件引用的地方都加上一个当前时间参数,然问题依然存在。

本来规定的版本就是IE8,所以也没有想过会有版本兼容问题,在说了咱用的是jquery,jqeruy的出现不就是号称为了解决浏览器的兼容问题么。

该死了问题,还真实版本问题。因为某些页面需要用到IE8的兼容模式,然兼容模式其实就是像下兼容,那不就是兼容IE7 了么?

于是本地用demo测试了下。

<form id="form1" runat="server">
  <div id="div">
   <input id="input" name="1" value="123" />
  </div>
 </form>
 <script src="jquery-1.6.4.min.js"></script>
 <script>
  $("#input").attr("name", "myname");
  alert("name:" + $("#input").attr("name") + "***html:" + $("#div").html());
 </script>

IE8:

解决IE7中使用jQuery动态操作name问题

ok!

IE8兼容模式:

解决IE7中使用jQuery动态操作name问题

??为什么 $("#input").attr("name")取到的是修改后的值,而$("#div").html() 取到的name还是原先的值??

F12查看生成的html

解决IE7中使用jQuery动态操作name问题

擦 submitName 是什么东东?明显name没有改变。submitName 应该是jquery生成的 然后读取name的时候 也是直接读取的submitName 的值。

那 为什么$("#div").html() 取的值中没有submitName 呢 ??  我也不知道jquery中的html方法是怎么实现的~~

项目中的实现方式类似于:

<form id="form1" runat="server">
  <div id="div">
   <input id="input" name="1" value="123" type="text" />
  </div>
  <div id="div2">
  </div>
 </form>
 <script src="jquery-1.6.4.min.js"></script>
 <script>
  //alert("name:" + $("#input").attr("name") + "***html:" + $("#div").html());
  $("#input").attr("name", "myname");
  $("#div2").html($("#div").html());
  var nameVal = $("#div2").find("input[name='myname']").val();
  alert(nameVal);
 </script>

这样  在IE8和谷歌浏览器 取值正常,在IE8兼容模式却取不到值。【不要问为什么非要这么赋值取值,这是demo'类似于'的实现,且是一个框架】

解决方案:

1.直接用jquery修改name 然后访问name是ok的,虽然 中间是生成了submitName 。

2.可以先$("#div2").html($("#div").html()); 然后在修改.attr("name", "myname");

3.可以直接拼接html。    $("#div").html("<input id="input" name="myname" value="123" type="text" />")

最后百度了下,原来是 IE7不能用document.getElementsByName()访问js动态创建和修改后的name值。

总结

以上所述是小编给大家介绍的解决IE7中使用jQuery动态操作name问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery zTree树插件动态加载实例代码
May 11 jQuery
关于jQuery库冲突的完美解决办法
May 20 jQuery
简单谈谈require模块化jquery和angular的问题
Jun 23 jQuery
jQuery 开发之EasyUI 添加数据的实例
Sep 26 jQuery
jQuery EasyUI Layout实现tabs标签的实例
Sep 26 jQuery
使用jQuery 操作table 完成单元格合并的实例
Dec 27 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
May 12 jQuery
jQuery实现获取多选框的值示例
Feb 07 jQuery
Jquery ajax书写方法代码实例解析
Jun 12 jQuery
jquery实现异步文件上传ajaxfileupload.js
Oct 23 jQuery
jQuery实现穿梭框效果
Jan 19 jQuery
jQuery菜单实例(全选,反选,取消)
Aug 28 #jQuery
基于jQuery实现图片推拉门动画效果的两种方法
Aug 26 #jQuery
详解webpack3如何正确引用并使用jQuery库
Aug 26 #jQuery
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 #jQuery
使用jQuery实现页面定时弹出广告效果
Aug 24 #jQuery
使用jquery+iframe做一个ajax上传效果(实例)
Aug 24 #jQuery
jQuery Datatable 多个查询条件自定义提交事件(推荐)
Aug 24 #jQuery
You might like
用PHP实现文件上传二法
2006/10/09 PHP
PHP个人网站架设连环讲(四)
2006/10/09 PHP
php实现只保留mysql中最新1000条记录
2015/06/18 PHP
php进行ip地址掩码运算处理的方法
2016/07/11 PHP
JavaScript使用prototype定义对象类型(转)[
2006/12/22 Javascript
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
2007/03/27 Javascript
javascript中的几个运算符
2007/06/29 Javascript
jQuery+HTML5实现图片上传前预览效果
2015/08/20 Javascript
javascript如何定义对象数组
2016/06/07 Javascript
深入解析Javascript闭包的功能及实现方法
2016/07/10 Javascript
js在ie下打开对话窗口的方法小结
2016/10/24 Javascript
JS对大量数据进行多重过滤的方法
2016/11/04 Javascript
Vue.js实战之组件之间的数据传递
2017/04/01 Javascript
Vue axios 中提交表单数据(含上传文件)
2017/07/06 Javascript
详解vue-router 路由元信息
2017/09/13 Javascript
说说AngularJS中的$parse和$eval的用法
2017/09/14 Javascript
vue实现的双向数据绑定操作示例
2018/12/04 Javascript
vue添加class样式实例讲解
2019/02/12 Javascript
JavaScript使用百度ECharts插件绘制饼图操作示例
2019/11/26 Javascript
vue-cli3项目打包后自动化部署到服务器的方法
2020/09/16 Javascript
微信小程序实现日历签到
2020/09/21 Javascript
javascript实现放大镜功能
2020/12/09 Javascript
Python使用MD5加密字符串示例
2014/08/22 Python
python通过urllib2获取带有中文参数url内容的方法
2015/03/13 Python
Python对列表排序的方法实例分析
2015/05/16 Python
Django实现微信小程序的登录验证功能并维护登录态
2019/07/04 Python
美国美食礼品篮网站:Gourmet Gift Baskets
2019/12/15 全球购物
医学生求职自荐信
2013/10/25 职场文书
高中生的学习总结自我鉴定
2013/10/26 职场文书
军校制空专业毕业生自我鉴定
2013/11/16 职场文书
会计学个人自荐信模板
2013/12/13 职场文书
学习十八大精神心得体会
2013/12/31 职场文书
大学运动会通讯稿
2014/01/28 职场文书
2014年物流工作总结
2014/11/25 职场文书
《悲惨世界》:比天空更广阔的是人的心灵
2020/01/16 职场文书
使用CSS设置滚动条样式
2022/01/18 HTML / CSS