javascript - 下拉列表中的jquery目标选择选项

Question

<select id="dropdown">
    <option value="200" selected>AMD Athlon 7x</option>
    <option value="300">Core i7</option>
    <option value="400">Core i5</option>
</select>
<select id="dropdown">
    <option value="250" selected>GTX 560 ti</option>
    <option value="350">GRX 680</option>
    <option value="40">ATI 6870</option>
</select>

我根据选定的值计算最终产品的价格。

$('select').change(function() {
});

我需要这个函数来删除选定的属性并将其分配给选定的选项，但我不知道如何定位新选择的选项。

Answer 1

$('select').change(function() {
     $(this).children(':selected').attr('selected', true);
});

但我不明白你为什么需要这个:)

Answer 2

像这样：

$('select :selected').change(function(){
  //more code
});

Answer 3

要获取所选选项，您的下拉列表应首先具有唯一 ID

<select id="dropdown1">
    <option value="200" selected>AMD Athlon 7x</option>
    <option value="300">Core i7</option>
    <option value="400">Core i5</option>
</select>
<select id="dropdown2">
    <option value="250" selected>GTX 560 ti</option>
    <option value="350">GRX 680</option>
    <option value="40">ATI 6870</option>
</select>

$("#dropdown1 option:selected");

现在，也就是说，您的下拉菜单将自动为您更改第一个下拉选择的选项。

另外，如果要在选中时抓取选中选项的值，使用.val()

$('select :selected').change(function(){
    $("#dropdown1 option:selected").val();
});

Answer 4

上述示例存在语法错误。以下是不正确的（我试过了，它不起作用）：

$('select :selected').change(function(){

以下是来自 jQuery 站点示例代码（我也尝试过，它确实有效）：

<select name="garden" multiple="multiple">
  <option>Flowers</option>
  <option selected="selected">Shrubs</option>
  <option>Trees</option>
  <option selected="selected">Bushes</option>
  <option>Grass</option>
  <option>Dirt</option>
</select>
/* ... */
<script>
$( "select" ).change(function() {   // <<<<< this is the correct syntax
  var str = "";
  $( "select option:selected" ).each(function() {
    str += $( this ).text() + " ";
  });
})
</script>