bug描述: 在ie下面使用innerHTML来插入option选项的话,ie会去掉前面的,并拆分成多个节点,这样会造成select的出错,不是没有插进去,而是节点在转换时出问题了,微软对这个bug也有描述,并提供了两个解决方案,大家可以自己搜索一下,我大概提下微软的两个方案。 1,使用createElement,这个是正规渠道,要出错还真有问题了。 2,插入完整的select字符串,到div中。 实现: 原理: 既然是使用innerHTML的人,肯定是想用字符串来插入option了,这里主要就是解决这人人群,当然你也可以传入createElement对象来插入。 对于传入的参数会做个判断,看是elementObj还是字符串,如果是elementObj那么就使用标准的add方法加入,并做兼容处理。如果是字符串则使用div包装完整的select并转换成dom对象用appendChild来加入。 注意: b$.type.isElement(arg)是bBank里面用来判断对象是否是element元素的方法 b$.browser.isIE()是bBank里面用来判断是否是ie的方法 b$.parseDom(str)是bBank里面用来转换字符串为标准dom的方法,在我前面的博客中有专门讲解 bBank 框架介绍:http://www.cnblogs.com/bruceli/archive/2010/04/15/bBank.html 代码如下: var sltObj=document.getElementById('xx');//获取select对象,这里只是给个例子,可以按自己习惯来获取 function addOption(obj, arg) { if (b$.type.isElement(arg)) { if (b$.browser.isIE()) obj.add(arg); else obj.add(arg, null); return; } var str = '' + arg + ''; var slt = b$.parseDom(str)[0]; for (var i = 0, num = slt.length; i < num; i++) { obj.appendChild(slt[0]); } }; 使用: 代码如下: addOption(sltObj, 'a'); END 到这里就结束了,在这里向大家推荐一个我自己写的js框架,上面的这个方法集成在框架里面了 使用:b$('obj').addOption(arg); 下载本文
实现: 原理: 既然是使用innerHTML的人,肯定是想用字符串来插入option了,这里主要就是解决这人人群,当然你也可以传入createElement对象来插入。 对于传入的参数会做个判断,看是elementObj还是字符串,如果是elementObj那么就使用标准的add方法加入,并做兼容处理。如果是字符串则使用div包装完整的select并转换成dom对象用appendChild来加入。
注意: b$.type.isElement(arg)是bBank里面用来判断对象是否是element元素的方法 b$.browser.isIE()是bBank里面用来判断是否是ie的方法 b$.parseDom(str)是bBank里面用来转换字符串为标准dom的方法,在我前面的博客中有专门讲解 bBank 框架介绍:http://www.cnblogs.com/bruceli/archive/2010/04/15/bBank.html 代码如下: var sltObj=document.getElementById('xx');//获取select对象,这里只是给个例子,可以按自己习惯来获取 function addOption(obj, arg) { if (b$.type.isElement(arg)) { if (b$.browser.isIE()) obj.add(arg); else obj.add(arg, null); return; } var str = '' + arg + ''; var slt = b$.parseDom(str)[0]; for (var i = 0, num = slt.length; i < num; i++) { obj.appendChild(slt[0]); } }; 使用: 代码如下: addOption(sltObj, 'a');
END 到这里就结束了,在这里向大家推荐一个我自己写的js框架,上面的这个方法集成在框架里面了 使用:b$('obj').addOption(arg);