jQuery 选择的选项仅在调试中工作答案

【问题标题】：jQuery selected option working only in debugjQuery 选择的选项仅在调试中工作
【发布时间】：2011-12-15 14:21:51
【问题描述】：

我有一个选择元素，我想在加载页面时设置一个特定的值：

<select id="Town">
<option value="">Select...</option>
<option value="4004">Town A</option>
<option value="4005">Town B</option>
<option value="4006">Town C</option>
<option value="4007">Town D</option>
<option value="4008">Town E</option>
<option value="4003">Town F</option>
</select>

当我尝试通过这行代码设置选择的选项时：

var SelectedTown = '4005';

jQuery('select#Town>option[value=' + SelectedTown + ']').attr('selected','selected');

它在运行模式下不起作用，我的意思是可见部分仍然是“选择...”但是，如果我在 Firebug 调试模式下运行它，则在行上中断，然后继续它工作，可见部分变为“Town B” '。

我也尝试了以下几行：

jQuery('select#Town').attr('value',SelectedTown);

jQuery('select#Town').val(SelectedTown);

jQuery('select#Town').val('4005');

但它们都不起作用。

我使用 jQuery 1.6.2。

知道我哪里错了吗？

【问题讨论】：

标签： jquery debugging select option

【解决方案1】：

您确定您的 JS 在文档就绪事件上运行吗？不是在 html 中内联？因为它看起来好像它可能只是因为（没有调试器）html 还不存在而失败。

【讨论】：

它在这个块中运行：jQuery(document).ready(function() {}，因此它应该在 DOM 完成时触发
在 Firebug 中我放了一个这样的手表： jQuery('#Town option[value=' + hiddenSelectedTown + ']') 就在 $("select#Town").val("4005 ") 我可以看到列出的所有 HTML 选项，包括 4005。

【解决方案2】：

去掉select，在Town和Option之间加一个空格

jQuery('#Town option[value=' + SelectedTown + ']').attr('selected','selected');

【讨论】：

#Town option 和 #Town>option 在这种情况下是等效的，但它们都不起作用。

【解决方案3】：

这看起来应该可以正常工作。这是 jsfiddle 中的一个示例，它在某种程度上被简化了，它可以工作：http://jsfiddle.net/neilheinrich/BdqUX/

$("select#Town").val("4005");

【讨论】：

另外，正如 skolima 所说，如果您的代码在 $(document).ready 之前运行，您的标记在运行之前将不存在。

【解决方案4】：

使用setTimeout 函数将代码暂停一段时间并恢复，

setTimeout(function(){
    // Your code here
},3000);

【讨论】：