Question

请解释我如何更改＆＃39;选择＆＃39;期权的财产？ E.g：

<select id="lang_select">
    <option value="en" selected="selected">english</option>
    <option value="ar">العربية</option>
    <option value="az">azərbaycanlı</option>
    <option value="bg">български</option>
    <option value="ca">català</option>
    <option value="cs">český</option>
    <!-- some data cut -->
</select>

因此，如果我更改下拉列表值，则html-data中没有任何更改。为什么呢？

只有当我尝试使用jQuery强制重新加载属性时才有效。

$(document).on('change',"select",function(){
    var i = $(this)[0].selectedIndex;
    var ch = $(this).children().each(function(index){
        $(this).prop('selected',index == i);
        if (index == i) {
            $(this).attr('selected','selected');
        } else {
            $(this).removeAttr('selected');
        }
    });
});

为什么呢？我怎么能避免这个？是否可以更改＆＃34;选择＆＃34;使用纯HTML？

修改我希望在html标签中存在此属性，因为我需要在将来保存并恢复此html代码的一部分。

Answer 1

更新了.attr("selected", true)替代.prop("selected", true)

注意，selected属性的值返回true或false，而不是"selected"。

尝试使用选择器$("option[value=" + this.value + "]", this)，将属性selected设置为true，.siblings()从selected中删除未选中的option属性

$(document).on("change","select",function(){
  $("option[value=" + this.value + "]", this)
  .attr("selected", true).siblings()
  .removeAttr("selected")
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="lang_select">
<option value="en"  selected="true">english</option>
<option value="ar">العربية</option>
<option value="az">azərbaycanlı</option>
<option value="bg">български</option>
<option value="ca">català</option>
<option value="cs">český</option>
<!-- some data cut -->

</select>

Answer 2

它不会更改html本身，但确实会更改select

的值

＆＃13;

$('select').change(function(){
    $('#result').html($(this).val());
}).trigger('change');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lang_select">
  <option value="en" selected="selected">english</option>
  <option value="ar">العربية</option>
  <option value="az">azərbaycanlı</option>
  <option value="bg">български</option>
  <option value="ca">català</option>
  <option value="cs">český</option>
  <!-- some data cut -->
</select>
<hr />
<div id="result"></div>

＆＃13;

Answer 3

使用val()方法。因此，在您的情况下，$("#lang_select").val('en');选择英语选项。顺便说一句，如果你想要选择第一个选项，你就不需要selected="selected"。默认情况下，会自动选择第一个选项。

选择选项未更新＆＃39;已选中＆＃39; HTML网页中的属性

3 个答案: