昨天项目测试的时候,IE8、IE11测试勾选checkbox然后执行保存的时候,竟然执行的结果与预期相反,吓屎我了,最终排查之下,原来是拼接checkbox的值的时候出现的问题。本人对js了解知之甚少,用的不多,最近几个项目都是大批的js,遇到各种小白问题,没办法只好慢慢学了。

HTML代码:

<input type="checkbox" name="test" value="1"/><span>1</span>
<input type="checkbox" name="test" value="2"/><span>2</span>
<input type="checkbox" name="test" value="3"/><span>3</span>
<input type="checkbox" name="test" value="4"/><span>4</span>
<input type="checkbox" name="test" value="5"/><span>5</span><br>
<input type='button' value='提交' onclick="fun()"/></span>

原js代码:

var obj = document.getElementsByName("test");
check_val = [];
for(k in obj){
if(obj[k].checked){
check_val.push(obj[k].value);
}
}
alert(check_val.length);

勾选1和2之后的执行结果:IE弹出0,Chrome和Firefox弹出2;

难道是IE不支持push()?

修改如下的js:

var obj = document.getElementsByName("test");
var s='';
for(k in obj){
if(obj[k].checked){
s+=obj[k].value+',';
}
}
alert("s"+s);

勾选1和2之后的执行结果:IE弹出s,Chrome和Firefox弹出s1,2,;

真奇怪,怎么IE又闹特别了呢?好吧,继续改

再次修改之后的js:

var obj = document.getElementsByName("test");
var s='';
for(k=0;k<obj.length;k++){
if(obj[k].checked){
s+=obj[k].value+',';
}
}
alert("s"+s);

勾选1和2之后的执行结果:三个浏览器一致的弹出s1,2,

总结一下吧

1.for...in 遍历的不是数组而是对象,所以他遍历访问的是obj的每个属性,而不是数组元素;

2.for....in循环的效率低于for循环;

关于IE,Chrome,Firefox浏览器的字符串拼接问题的更多相关文章

  1. Selenium加载Chrome/Firefox浏览器配置文件

    Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我们可能需要加载默认配置. 一.Chrome浏览器 1.在Chrome浏览器的地址栏输入:chrome://v ...

  2. Selenium 加载Chrome/Firefox浏览器配置文件

    Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我们可能需要加载默认配置. 一.Chrome浏览器 1.在Chrome浏览器的地址栏输入:chrome://v ...

  3. 【转】Selenium 加载Chrome/Firefox浏览器配置文件

    原文地址:https://www.cnblogs.com/eastonliu/p/9083982.html Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我 ...

  4. chrome,firefox浏览器字体发虚解决办法

    打开微软自家的edge浏览器,字体就没有问题,刚开始以为是浏览器的问题,调整半天也没有效果,后来怀疑是Windows系统的问题,于是尝试调整字体,成功解决! 解决方案: 进入个性化->字体-&g ...

  5. chrome firefox浏览器屏蔽百度热搜

    我是原文 操作 点击拦截元素,然后选择页面元素,添加

  6. Chrome firefox ie等浏览器空格&nbsp;宽度不一样怎么办

    有点强迫症,之前某个页面用了空格 ,但是在chrome firefox 和ie显示的宽度都不一样,无法对齐. 搜索了一下,很多人都转载了那篇设置成宋体的,可是仍然没对齐,要么ie对齐,要么chrome ...

  7. 各种浏览器的Hack写法(chrome firefox ie等)

    Hack是针对不同的浏览器去写不同的CSS样式,从而让各浏览器能达到一致的渲染效果,那么针对不同的浏览器写不同的CSS CODE的过程,就叫CSS HACK,同时也叫写CSS Hack. 然后将Hac ...

  8. IE/Firefox/Chrome等浏览器保存Cookie的位置

    IE/Firefox/Chrome等浏览器保存Cookie的位置 原文  http://smilejay.com/2013/04/browser-cookie-location/   前面写了篇长文( ...

  9. selenium启动firefox、ie、chrome各浏览器方法

    1.启动firefox浏览器 a.如果你的本地firefox是默认路径安装的话,如下方式即可启动浏览器 WebDriver driver = new FirefoxDriver(); driver.g ...

随机推荐

  1. RabbitMQ系列教程之五:主题(Topic)

    (本实例都是使用的Net的客户端,使用C#编写),说明,中文方括号[]表示名词.   在上一个教程中,我们改进了我们的日志记录系统. 没有使用只能够进行虚拟广播的[Fanout]交换机,而是使用了[D ...

  2. Bootstrap模态弹出框

    前面的话 在 Bootstrap 框架中把模态弹出框统一称为 Modal.这种弹出框效果在大多数 Web 网站的交互中都可见.比如点击一个按钮弹出一个框,弹出的框可能是一段文件描述,也可能带有按钮操作 ...

  3. 在Apworks数据服务中使用基于Entity Framework Core的仓储(Repository)实现

    <在ASP.NET Core中使用Apworks快速开发数据服务>一文中,我介绍了如何使用Apworks框架的数据服务来快速构建用于查询和管理数据模型的RESTful API,通过该文的介 ...

  4. 如何清除img图片下面有一片空白

    最近在做项目突然发现用了img后有个空白区,如下图: 真的很影响美观,那么是什么原因造成的呢? 右键查看元素查看上下文的margin和padding也没有找到这个空白的来源. 只好上网看看别人是怎么说 ...

  5. Android5.1 - 通讯录建立群组

    [问题] 在没有账户的时候,不应该有添加联系人群组的选项. 我们要把这个选项干掉. [相关log]06-23 17:25:00.804: E/GroupEditorFragment(6030): No ...

  6. ES6正则表达式扩展

    前面的话 正则表达式是javascript操作字符串的一个重要组成部分,但在以往的版本中并未有太多改变.然而,在ES6中,随着字符串操作的变更, ES6也对正则表达式进行了一些更新.本文将详细介绍ES ...

  7. 最短路径之Dijkstra算法和Floyd-Warshall算法

    最短路径算法 最短路径算法通常用在寻找图中任意两个结点之间的最短路径或者是求全局最短路径,像是包括Dijkstra.A*.Bellman-Ford.SPFA(Bellman-Ford的改进版本).Fl ...

  8. js实现日期显示的一些操作

    1.js获取当前日期(yyyy-mm-dd) 以下代码是获取到的当前日期: var myDate = new Date(); var year = myDate.getFullYear(); //获取 ...

  9. 【SignalR学习系列】2. 第一个SignalR程序

    新建项目 1.使用VisualStudio 2015 新建一个Web项目 2.选择空模板 3.添加一个新的SignalR Hub Class (v2)类文件,并修改类名为ChatHub 4.修改Cha ...

  10. Object-C 里面的animation动画效果,核心动画

    #import "CoreAnimationViewController.h" @interface CoreAnimationViewController ()@property ...