根据下拉选项的“title”属性更新文本字段

Question

我会根据下拉选项的标题属性更新input字段（第一次隐藏）。

<form>
     <select id="selectbox">
         <option name="test" value="one" title="title1">one</option>
         <option name="test2" value="two" title="title2">two</option>
     </select>
</form>
<input id="description_field" type="hidden"/>

Answer 1

  

使用:selected selector获取selected选项并使用.attr获取指定的attribute

最初使用.change()来调用处理程序。

$('#selectbox').change(function() {
  $('#description_field').val($(this).find('option:selected').attr('title'));
}).change(); //to invoke the handler intially!

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form>
  <select id="selectbox">
    <option name="test" value="one" title="title1">one</option>
    <option name="test2" value="two" title="title2">two</option>
  </select>
</form>
<input id="description_field" type="text" />

Answer 2

你可以，

$("#selectbox").change(function() {
  $("#description_field").val($(this).find("option:selected").attr("title"));
});

• 将更改事件绑定到选择框
• 使用"option:selected"选择器
获取所选选项
• 使用.attr("title")
获取title属性