`
swingboat
  • 浏览: 61823 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

IE对select的处理,又一怪现象:innerHTML竟然不起作用。

阅读更多

我们用select来选取一个国家,当我辛辛苦苦拼凑字符串,然后把这个字符串赋值给select的innerHTML,运行,在firefox下能显示出所有的国家。但是在IE下却什么都没有显示。刚开始我还以为是我拼凑的字符串有问题,仔细检查没有啊。后台到google上search了下,发现是ie处理select的一个bug。于是做了一个简单的测试。

 1<html>
 2<head>
 3<title>test</title>
 4<script language="javascript">
 5function test(){
 6    var elem=document.getElementById("testS");    
 7    elem.innerHTML="<option value=1>aa</option>";
 8}

 9
10
</script>
11</head>
12<body>
13<input type=button value=test onclick='test()'>
14<div>
15    <select id='testS'></select>
16</div>
17</body>
18</html>


点击test按钮,在IE下,select框没有任何的内容。怪异啊!
于是不得不利用Option对象来增加select的内容。

0
0
分享到:
评论

相关推荐

    解决ie6 select的title不能显示的问题

    本文将针对一个特定的问题——如何在Internet Explorer 6(IE6)中使`select`元素的`title`属性能够正常显示——进行详细解析,并提供一种通过JavaScript来实现解决方案的方法。 #### 问题背景 在IE6中,当用户...

    解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)

    前言: 这是一个老bug了,现在提供一个完美... bug描述: 在ie下面使用innerHTML来插入option选项的话,ie会去掉前面的,并拆分成多个节点,这样会造成select的出错,不是没有插进去,而是节点在转换时出问题了,微软对

    IE6/7/8中使用innerHTML清空元素,其子元素也被清空

    这个现象在其他现代浏览器中并不常见,因此了解这一问题对于解决跨浏览器兼容性问题至关重要。 `innerHTML`是JavaScript中一个非常实用的属性,用于获取或设置HTML元素内部的HTML内容。当你为一个元素设置`...

    关于在innerHTML中JS不执行的问题

    3. **利用事件监听**:可以将JavaScript代码包装在一个特定的事件处理函数中,例如点击事件,然后通过`innerHTML`添加这个事件触发器。 ```javascript let html = ` &lt;button id="myButton"&gt;Click me document....

    解决ajax返回innerHTML中javascript不能运行问题

    解决 Ajax 返回 innerHTML 中 JavaScript 不能运行问题 在实际应用中,我们经常会遇到使用 Ajax 返回某一个网页的内容到模板页面的某一个 `&lt;div&gt;` 标签中显示的操作。如果返回的值仅仅是文本类数据,不会影响模板...

    innerHtml(转)

    标题中的"innerHtml(转)"可能是指HTML DOM(Document Object Model)中的一个属性`innerHTML`,这是一个非常关键的概念,特别是在JavaScript中用于处理HTML元素的内容。`innerHTML`允许我们获取或设置HTML元素内部...

    IE6/7/8/9中Table/Select的innerHTML不能赋值的解决方法

    在非IE浏览器中,这段代码可以正常工作,但在IE6、7、8、9中,它将不起作用,导致无法更新表格内容。 对于表格(Table),一个可行的解决方法是利用DOM操作来创建新的表格元素,然后将其插入到文档中。例如,可以先...

    IE6-IE9中tbody的innerHTML不能赋值的解决方法

    IE6-IE9中tbody的innerHTML不能赋值,重现代码如下 Js代码 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset=utf-8/&gt; &lt;title&gt;IE6-IE9中tbody的innerHTML不能复制bug&lt;/title&gt; &lt;/...

    用谷歌浏览器得不到动态添加表单的值

    在使用谷歌浏览器(Chrome)处理网页交互时,有时会遇到一个问题:通过JavaScript的`innerHTML`属性无法正确获取动态添加到页面中的表单元素的值。这个问题与不同浏览器之间的兼容性有关,尤其是与Internet Explorer...

    js之Select用法

    总结,`select`元素在JavaScript中是不可或缺的一部分,尤其在表单提交和用户交互场景中。通过熟练掌握它的用法和相关事件处理,可以构建更丰富、更具有交互性的网页应用。希望这个详解能帮助你理解和运用`select`...

    IE bug table元素的innerHTML

    首先时飘忽不定的collapse的border,ie6偏偏有一个地方与其他浏览器表现不同,一条丑陋的border不管怎么样都显示出来。无解。 上面的问题可以用诡异方法解决的话,那接下来就完全没有办法了。 由于涉及到了数据的...

    js实现动态生成select中的option

    在JavaScript编程中,动态生成`select`元素中的`option`是一项常见的需求,特别是在网页交互或者数据展示时。本文将深入探讨如何使用JavaScript实现这一功能,同时结合提供的`autoSelect.html`和`autoselect.txt`...

    通过改变innerHTML的内容,动态增加选择项

    这段代码会找到ID为`mySelect`的`&lt;select&gt;`元素,并在其现有的`innerHTML`后追加一个新的`&lt;option&gt;`元素。由于`innerHTML`会替换整个元素的内容,所以我们使用`+=`操作符,这意味着我们是在当前内容的基础上添加,而...

    javascript登录时判断ie6,分别处理

    - **CSS选择器API**:IE6不支持`getElementsByClassName`和`querySelectorAll`等现代CSS选择器API,需要通过其他方式(如jQuery等库)实现。 3. **样式兼容**: - IE6对盒模型的理解与W3C标准不同,导致布局问题...

    IE 不兼容的几个js问题及解决方法

    设置元素的样式属性时,使用`setAttribute`方法在IE中可能会不起作用。 **解决方法:** 1. **内联样式:** 使用`style.cssText`属性来设置样式: ```javascript var obj = document.getElementById("some...

    js select多级联动

    - 使用纯JavaScript:通过监听事件,获取当前选中的值,然后遍历数据结构,找到对应的子选项,再用`innerHTML`或`appendChild`等方法更新下一级的`&lt;select&gt;`。 - jQuery库:jQuery提供了一些便捷的DOM操作方法,...

    select选择框内容左右移动

    在IT领域,尤其是在前端开发中,`select`选择框是一种常见的用户交互元素,用于让用户从预定义的选项中选择一个或多个值。本主题聚焦于如何实现`select`选择框内容的左右移动功能,这是一种增强用户体验的方式,尤其...

    向元素中动态添加option

    在本案例中,`&lt;option&gt;`元素就是DOM的一部分,我们可以通过JavaScript的DOM操作方法来对其进行动态管理。 首先,创建一个新的`&lt;option&gt;`元素需要使用`document.createElement('option')`。然后,可以使用`....

    Angular中innerHTML标签的样式不起作用的原因解析

    总结来说,要解决 Angular 中 `innerHTML` 样式不起作用的问题,需要理解框架的安全策略,并合理使用 `DomSanitizer` 服务或自定义管道来绕过这些策略。同时,开发者应该密切注意安全性问题,防止潜在的跨站脚本攻击...

Global site tag (gtag.js) - Google Analytics