JavaScript: getElementById不工作在IE8

JavaScript: getElementById not working in IE8

本文关键字：IE8 工作 getElementById JavaScript      更新时间：2023-09-26

我用这个非常简单的JavaScript在span中显示选中的选项。它在除IE8以外的所有浏览器中都可以正常工作。

代码- 

<select onchange="searchdisplay(this.value)">
<option>kill</option>
<option>bill</option>
<option>by</option>
<option>torentino</option>
<option>is </option>
<option>not </option>
<option>good</option>
<Select>
<span id="container">
<span>

Script - 

<script>
function searchdisplay(val)
{
    var div = document.getElementById('container');
    div.innerHTML =  val;
}
</script>

有解决方案吗?谢谢。

问题是IE8中的this.value更改为:-

<select onchange="searchdisplay(this.options[this.selectedIndex].value)">，它应该工作良好。

演示

当前代码

像其他人在评论中说的那样修复你的标记。

<select onchange="searchdisplay(this.options[this.selectedIndex].value)">
    <option>kill</option>
    <option>bill</option>
    <option>by</option>
    <option>torentino</option>
    <option>is</option>
    <option>not</option>
    <option>good</option>
</select>
<span id="container"></span>

理想的方法是为select选项添加value属性。和this.value，这可能是保证工作

你的脚本不工作。如果你的value属性不存在，

我猜其他浏览器没有寻找"值"属性。并在缺少选项时使用该选项的文本，但IE8确实需要它..

将value属性添加到每个选项中，就可以了

<select onchange="searchdisplay(this.value)">
<option value="kill">kill</option>
<option value="bill">bill</option>
<option value="by">by</option>
<option value="torentino">torentino</option>
<option value="is ">is </option>
<option value="not ">not </option>
<option value="good">good</option>
</select>

这个关于IE8事件处理的页面说:

微软的事件处理充满了缺点，其中一些更严重的是:

  1. 只有一个全局事件对象，而不是每个事件一个局部对象。

  2. 当使用attachEvent方法时，在事件处理中使用关键字this函数指的是窗口对象，而不是它的HTML事件实际上发生在。

  3. 不支持捕获阶段。不同的语法，需要"on"

第2项对我来说意味着onchange中的this将是window，而不是单击的元素。要检查这个日志，或者在IE8中更好，警告传递到searchDisplay

的值

以下代码:

<script type="text/javascript">
function getOption(e) {
    var event = e|window.event;
        alert(event.srcElement.innerHTML); // works in IE but shows the select object
        alert(event.target.innerHTML); // works well in FF, shows the right option
}
</script>
<body oncontextmenu="return false;">
<select size="4" oncontextmenu="getOption(event)">
    <option value="1"> option1 </option>
    <option value="2"> option2 </option>
</select>
</body>

可能会对您有所帮助，这里发布的是为了解决与select非常相似的情况。

相关文章：