选择后，选择选项的文本会有所不同

Question

问题

这很难解释，所以请耐心等待。今天我遇到了一个奇怪的场景，我解决了，但我不确定为什么我的解决方案有效。

我创建了一组选择并编写了一个脚本，通过从其他选择列表中删除所选选项，限制您多次选择相同的选项。

但是在 IE（包括IE9）中，选项列表显示错误的选项，但一旦选中，它将显示正确的选项。

重新创建错误

在我的第一个脚本中，您可以通过执行以下操作来达到此状态：

注意：这只是IE。适用于Chrome

脚本： http://jsfiddle.net/s6F4h/37/

1. 在第一个下拉菜单中选择3
2. 在第二个下拉菜单中选择1
3. 在第一个下拉列表中选择1（不应该是可用选项）
4. 请注意，所选值为2！
5. 请注意，在第二个下拉列表中更改所选值也会产生与呈现值不同的值。
6. 最后，请注意DOM正在显示正确的值

修复错误（神奇地）

现在通过随机猜测找到我的修复工具......

脚本： http://jsfiddle.net/s6F4h/36/

像这样创建我的选择会导致奇怪的行为：

var $S1 = $('<select class="question" />'); 

创建这样的选择可以纠正这种行为：

var $S1 = $('<select />', {'class': 'question'}); 

跟进

• 上面两个jQuery对象有什么区别？
• IE在其DOM中显示一件事，在实际页面上显示另一件事（我知道CSS content可以做到这一点，但是没有涉及到CSS）？不会那么糟糕，这只是一个IE6-8的东西，但它在IE9中可以重现！
• 可能是IE错误还是jQuery错误？

最后，也许我刚刚做了一些令人难以置信的愚蠢事情，并且在我的歇斯底里中编造了一些荒谬的结论。请轻轻地，如果我这样做，请通知我。

Answer 1

两个DOM对象之间的区别不在于数据，而在于创建它们时的操作顺序。

当您使用$('<select class="blah" />')的内联时，<select>元素会在类已经完整的情况下创建，并相应地设置样式。当你使用$（<select />，{'class'：'blah'}）`时，你执行2个操作：1）创建项目，2）设置它的类。

这似乎无害，但它实际上迫使浏览器在应用CSS类时重新绘制元素。

现在 - 在你的场景中，这导致它所做的特定问题这一事实显然是一个适用于IE的错误 - 但是IE 不应该的行为显然很差方式阻止它这样做。

希望这会有所启发。

Answer 2

我添加了

`$("select.question").val('[what ever selection you want selected');`

让它发挥作用。或许我误解了你的问题。