10

问题

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

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

但是在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内容可以做到这一点，但不涉及 CSS）？如果这只是一个 IE6-8 的东西，那还不错，但它可以在 IE9 中重现！
  • 可能是 IE 错误还是 jQuery 错误？

最后，也许我刚刚做了一些非常愚蠢的事情，并且在我的歇斯底里编造了一些荒谬的结论。如果我这样做了，请轻轻地告诉我。

4

2 回答 2

2

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

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

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

现在-在您的情况下，这会导致它确实存在的特定问题这一事实显然是一个适用于 IE 的错误-但 IE显然不应该表现不佳这一事实绝不会阻止它这样做。

希望这能有所启发。

于 2012-08-08T23:05:44.927 回答
0

我添加了

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

让它工作。或者我误解了你的问题。

于 2012-07-05T13:19:20.570 回答