2

我有这个非常简单的 JavaScript 来显示跨度中的选定选项。它在除 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>
function searchdisplay(val)
{
    var div = document.getElementById('container');
    div.innerHTML =  val;
}
</script>

有什么解决办法吗？谢谢。

4

3 回答 3

1

问题在于this.value在 IE8 中将其更改为：-

<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>

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

于 2013-05-19T06:46:45.560 回答
1

您的脚本确实有效..只是您的 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>
于 2013-05-19T06:49:48.897 回答
0

这个页面专门关于 IE8 事件处理说：

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

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

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

  3. 不支持捕获阶段。不同的语法，需要为相关事件添加“on”前缀。

第 2 项对我来说意味着this你onchange将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>

可能会对您有所帮助，它张贴在这里是为了解决与选择非常相似的情况。

于 2013-05-19T06:53:37.050 回答