Internet Explorer 的 Jquery 选择框问题答案

【问题标题】：Jquery select box problem with Internet ExplorerInternet Explorer 的 Jquery 选择框问题
【发布时间】：2010-03-01 16:33:11
【问题描述】：

好的，这可能是一个非常奇怪的问题。我正在写一个网络应用，我想改变某个选择框的值：

<select name="type" class="type">
<option value="word">word</option>
<option value="digit">digit</option>
<option value="letter">letter</option>
<option value="single">single character</option>
<option value="space">space</option>
</select>

在我的代码中我有这个：

switch ( target ) {
case "d":
$("select").val('digit');
break;
case "w":
$("select").val('word');
break;
case "s":
$("select").val('space');
break;
}

这就是问题所在。此代码在所有浏览器中都按预期工作......除了 IE。除了 $("select").val("digit") 部分之外，Internet Explorer（8，如果您好奇的话）都能正确处理它们。由于某种原因，它不会改变值。 javascript 解析器在 switch 和所有情况下正确导航到该案例，但它拒绝更改该案例的选择框的值。有人有什么想法吗？

【问题讨论】：

标签： javascript jquery internet-explorer

【解决方案1】：

你试过了吗

$('select').find('option[value=digit]').prop('selected', true); // and etc.

相反？

edit 好吧，我可能会自己尝试一下，因为那只是我，但是看看 jQuery 源代码，无论如何它几乎可以为你做到这一点。（也就是说，jQuery 不只是尝试在<select> 标签上设置“value”属性，我认为它适用于 FF 而不是 IE。）

编辑更多好吧，我设置了一个测试页面，它在 FF 和 IE8 中对我来说都很好。你可以在这里查看我的测试页面：http://gutfullofbeer.net/select.html

edit — 2012 年 7 月 12 日 — .prop() 现在是首选 (jQuery 1.6)，所以我更新了示例。

【讨论】：

$('select').val('<some string or empty>') 在 IE 中不起作用。以下事情有效：$('select').val($(this).attr('class')) - 如您的演示中所示$('select').val($('option:first', this).val())
@escist 是的，它适用于所有现代版本的 jQuery。如果你说的事情在 IE 中有效，那么第一个当然也可以，只要传入的值与 <option> 标记之一的值匹配。
是的.. 抱歉我忘了提，我使用的是 1.6.1

【解决方案2】：

您可以尝试将“已选择”一词添加到要显示的选项中，而不是更改选择标记的值。你会想要你想要的选项的 HTML...

<option selected value="word">word</option>

单词在标签中的位置无关紧要。

【讨论】：

除非是在 XHTML 中，在这种情况下你会希望 selected=selected。