HTML选择，在DOM中选择正确的选项，但在Firefox中显示错误的项目 [英] HTML select, correct option selected in DOM, but wrong item shown in firefox

问题描述

这其实是一个从另一个SO问题。

在jsFiddle示例中 http://jsfiddle.net/5WrcD/2/show/ 当您更改一个选择另一个获取值同步。请使用Firebug试试这个和选择菜单展开。

当你第一次加载页面并改变首先选择 20 时， selected = selected在DOM中都变成 20 ，但是在显示中没有显示。

有什么想法，为什么发生这种情况？

这个例子使用了 Ember.js 库，但无论如何显示器应该反映DOM状态吗？ / b>

这个错误只发生在Firefox，这是一个Firefox特定的问题

解决方案

在Chrome / Safari中运行，而不是在FF中运行。也许这两个Ember.js警告的意思是：

1. 警告：默认情况下，计算属性很快就会被缓存。要在您的应用程序中启用此功能，请设置 ENV.CP_DEFAULT_CACHEABLE = true 。
   ember-0.9.8.1.js（line 65）
   

2. 警告：{{view}}助手影响模板的方式即将更改。以前，子视图中的模板将使用新视图作为上下文。不久，视图将在呈现模板时保留其父上下文。您可以通过设置 ENV.VIEW_PRESERVES_CONTEXT = true 来尽早选择新行为。有关更多信息，请参见 https://gist.github.com/2494968 。你应该尽快更新你的模板;这个默认设置很快就会改变，这个选项将会在1.0版本发布之前完全消除。

---

Update＃1：

看起来像关闭所有选中的元素（创建元素之后）也有帮助。附加到你的脚本的结尾：

pre $ set $ set $（$选项'）。prop（'selected' ，false）;}，100）;
//按照FabrícioMatté的建议匿名化

注意：可能会有一个回调，你可以做到这一点，而不是100毫秒后自动运行。

---

更新＃2： / h2>

它看起来像不是设置选项的属性，而是可以删除Ember创建的内容：

< pre $ App.myController = Ember.Object.create（{
// content：10 / *注释掉，移除或设置为''而不是10 * /
}）;


注意：我不使用Ember，所以我不知道如果这会影响任何事情的话

This is actually an issue sorted out from another SO question.

In the jsFiddle example here http://jsfiddle.net/5WrcD/2/show/ when you change one select the other one gets the value synchronised. Please try this with Firebug on and both select menus expanded.

When you first load the page and change first select to 20, the selected="selected" on both becomes 20 in DOM, but not shown in display.

Any idea on why this is happening?

The example uses Ember.js library, but anyway the display is supposed to reflect the DOM state right?

This bug only happens in Firefox, this is a Firefox specific question

解决方案

Works in Chrome/Safari, not in FF. Perhaps these two Ember.js warnings mean something:

1. WARNING: Computed properties will soon be cacheable by default. To enable this in your app, set ENV.CP_DEFAULT_CACHEABLE = true. ember-0.9.8.1.js (line 65)

2. WARNING: The way that the {{view}} helper affects templates is about to change. Previously, templates inside child views would use the new view as the context. Soon, views will preserve their parent context when rendering their template. You can opt-in early to the new behavior by setting ENV.VIEW_PRESERVES_CONTEXT = true. For more information, see https://gist.github.com/2494968. You should update your templates as soon as possible; this default will change soon, and the option will be eliminated entirely before the 1.0 release.

---

Update #1:

It looks like turning off all the selected (after the elements have been created) also helps. Attach to the end of your script:

setTimeout( function (){ $('option').prop('selected',false); } , 100 );
// Anonymized as per Fabrício Matté's suggestion

Note: There may be a callback you can do it in, instead of running it automatically 100ms after.

---

Update #2:

It also looks like instead of setting the properties of the option, you can remove the content of the Ember creation:

App.myController = Ember.Object.create({
   //content: 10    /* comment out, remove, or set to '' instead of 10 */
});

Note: I do not use Ember, so I don't know if this would effect anything

这篇关于HTML选择，在DOM中选择正确的选项，但在Firefox中显示错误的项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！