Question

我有隐藏的表单，其中包含一些选择字段和一些输入字段。单击按钮应显示该表单并在字段中设置一些值。输入字段用给定的值填充，但是我对选择字段有问题。

使用此代码：

$("#form select[name=user]").val(value);

带有该值的

选项获取“已选中”属性（在Firebug中选中），但选择字段仍显示“选择”（初始）选项。

我在设定值后尝试进行对焦和模糊，但这也无效。

有什么建议吗？

这几乎是标准形式：

<form action="#" id="form" class="fix">
<div class="holder">
    <label>User:</label>
    <select name="user" class="styled">
        <option value="0" selected>Choose</option>
        <option value="1">User 1</option>
        <option value="2">User 2</option>
        </select>
    </div>
</form>

通过调用jQuery语句：

$("#form select[name=user]").val('2');
$("#form").show();

我在Firebug中得到了这个：

<form action="#" id="form" class="fix" style="display:none">
<div class="holder">
    <label>User:</label>
    <select name="user" class="styled">
        <option value="0">Choose</option>
        <option value="1">User 1</option>
        <option value="2" selected>User 2</option>
        </select>
    </div>
</form>

但文字选择保持“选择”。如果我提交表单，则值正确传递。

如果我重置表单并选择某个选项，则会正确显示所选选项的文本。这对我来说很奇怪。

Answer 1

我找到了解决方案。我忘了给改变事件打电话。我不知道jQuery不会自动执行此操作。所以解决方案的代码是：

$("form select[name=user]").val(value).change();

Answer 2

我在下拉html广告代码时遇到了同样的问题。并得到了解决方案。我在下面分享使用.change（）,. attr（）和.prop（）时的分析。

.change（）：当我使用 .change（）不能在我的情况下工作时，所以它不可靠。浏览器版本问题。
.attr（）：当我使用 .attr（）方法/函数时，例如。 $('#db_service option[value=1]').attr('selected', 'selected'); 分析：当我看到源代码时，它将select tag的选项的属性设置为selected = selected。但是在屏幕上没有出现变化。
.prop（）：当我使用 .prop（）方法/功能时，例如。 $('#db_service option[value=1]').prop('selected', 'selected'); 分析：当我看到源代码时，选择=选择的选项=选择的WONT set属性。但是在屏幕上，已经发现了变化。

我的解决方案： 使用.attr（）和.prop（）来获得更完美的结果

$('#db_service option[value=1]').attr('selected', 'selected'); $('#db_service option[value=1]').prop('selected', 'selected'); $('#db_service').val("1").change()

Answer 3

我遇到了同样的问题。在http://api.jquery.com/attr/，有一些关于.prop（）方法的注释，而不是.attr（）。另外，就像Jovica的回答一样，如果我们在最后使用.change（）方法，更改的选项只出现在Firefox（20.0是我的版本）中。

Answer 4

我有同样的问题，我试图在隐藏的表单中更改选择的选项。

.attr(attribute, value)无效，因为显示的选项未显示，即使所选属性已正确更新。 .prop(property,value)成功了。

Answer 5

'#form select[name=user]'正在尝试选择<select name="user">元素，该元素是id为“form”的元素的子元素...例如：

<div id="form">
  <select name="user">  // This element

我相信你想要以下内容：

$("form select[name=user]").val(value);

现在应该选择一个<select name="user">元素作为表单的子元素，例如：

<form>
  <select name="user"> //This element

Answer 6

我想提一下，我在这里尝试了所有方法，仅在$("#form select[name=user]").val(value);上方添加了以下行对我有用：

$('#form select[name=user]').trigger("updated");

使用jQuery select更改它不会显示所选选项

6 个答案: