Html html选择即使在设置选择后也不显示选择
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26501195/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
html select not show selected even after set selected
提问by kuldeep.kamboj
I have a country dropdown and I set the selected attribute to US. I can clearly see select="selected" into select OPTION having value US in firebug. But neither firefox or chrome shown US as selected. I have code for populate & selected country as follows.
我有一个国家/地区下拉列表，并将所选属性设置为美国。我可以清楚地看到 select="selected" 到 select OPTION 在萤火虫中具有价值 US 。但是 firefox 或 chrome 都没有将 US 显示为选中状态。我有如下填充和选定国家/地区的代码。
var countryData = getCountryData();
var html = '<option value="">Select Country</option>';
$.each(countryData, function(key,value) {
if(defaultValue == value.id)
{
html = html + '<option value="'+value.id+'" selected="selected">'+value.name+'</option>';
}
else
{
html = html + '<option value="'+value.id+'">'+value.name+'</option>';
}
});
countryField.html(html);
If it is really possible for any reason to browser not shown the selected even we set the attribute selected.
如果确实有可能出于任何原因浏览器不显示选定的，即使我们设置了选定的属性。
UPDATE : Ok guys, As I was expecting it must be conflicted by other code. And that is the case . I am using bootstrapValidator and a special call "resetForm" which did this behavior. However one thing I did not understand why still html select in firebug shown selected attribute ? But at last I placed this code after resetForm call. Thanks to all for suggestions & help.
更新：好的，正如我所期望的那样，它必须与其他代码发生冲突。就是这样。我正在使用 bootstrapValidator 和执行此行为的特殊调用“resetForm”。但是有一件事我不明白为什么萤火虫中的 html select 仍然显示 selected 属性？但最后我在 resetForm 调用之后放置了这段代码。感谢大家的建议和帮助。
回答by Gogol
I had this peculiar problem of multiple select not selecting the selected values. What I ended up doing is select them with JS (I have jQuery in my app, so that makes it easier) like so:
我遇到了多重选择不选择选定值的特殊问题。我最终做的是用 JS 选择它们（我的应用程序中有 jQuery，这样更容易）像这样：
$('#select_element').find('option[selected="selected"]').each(function(){
$(this).prop('selected', true);
});
I know this is ugly, and it should be avoided, but if nothing works, this WILL work.
我知道这很丑陋，应该避免，但如果没有任何效果，这将起作用。
回答by Nishad K Ahamed
you dont need to set selected="selected", selecteditself is sufficient
你不需要设置selected="selected"，selected本身就足够了
<option value="anything" selected>anything</option>
Also check, is your HTML markup is correct. You are closing the <option> with </value>. It is wrong, should be <option></option>
还要检查您的 HTML 标记是否正确。您正在关闭<option> with </value>. 错了，应该是<option></option>
EDIT
编辑
If the above solution is not working, you could set it through JavaScript:
如果上述解决方案不起作用，您可以通过 JavaScript 进行设置：
document.getElementById("idOfSelect").selectedIndex = "1";//index starts from 0
回答by xatzistnr
This works for me but you can try this:
这对我有用，但你可以试试这个：
countryField.html(html).trigger('change');
countryField.html(html).trigger('change');
回答by Andrew Luo
you don't need selected="selected" just value.id + ' selected>' + ... also it should be not lastly, check that
你不需要 selected="selected" 只是 value.id + ' selected>' + ...也不应该是最后，检查
defaultValue == value.id
in the debugger.
在调试器中。
