jquery - 如何使我的选择元素的标题等于所选选项的标题？

Question

我有一个看起来像这样的选择：

<select id="select-site" title="????">
   <optgroup label="City">
      <option title="ee" value="1">123</option>
      <option title="cc" value="2">456</option>
      <option title="dd " value="3">789</option>
      <option title="xx" selected="selected" value="4">aa</option>
   </optgroup>
</select>

我怎样才能使它在文档加载后选择的标题是???? 更改为所选选项的标题。另外，我怎样才能做到这一点，以便当我更改所选选项时，标题<select>会再次更新。

Answer 1

试试这个 ：

<script type="text/javascript">
$(document).ready(function(){
$('#select-site').change(function() {
var selectedVal = $('#select-site option:selected').attr('title');
$('#select-site').attr("title",selectedVal) ;
});
});

</script>

Answer 2

这会将 的title属性设置#select-site为title选定的option

$('#select-site').change(function() {
  $(this).prop('title', $('option:selected', this).prop('title'));
});

要设置属性的初始值，title您需要trigger更改事件：-

$('#select-site').trigger('change');

或者

$('#select-site').change();

$(document).ready()正如下面的评论中所指出的那样，所有这些都需要包含在内。

Answer 3

试试这个以获得完整的解决方案

$(document).ready(function() {
    $('#select-site').change(function() {
        $(this).attr('title', $(this).find('option:selected').attr('title'));
    });
    $('#select-site').trigger('change');
});​

Answer 4

试试这个：

$('#select-site').change(function(){
     value = $(this + ' option:selected').val();
     $(this).attr('title',value);
});

它会起作用的。