Demo

Question

我的网站中有几个下拉列表（选择选项）。我想要实现的是当用户从一个下拉列表中选择一个选项，然后从第二个下拉列表中选择一个选项时，第一个选项将恢复为默认值。

有什么建议吗？

这是我用jQuery试过的：

我标记了我无法找到正确命令的大写字母..我尝试了几种方法，但没有好处。没有工作的命令列表：

$("#target").val($("#target option:first").val());
this.find('option:eq(0)').prop('selected', true);

我尝试过 - 工作但更改值命令不起作用。它遍历所有选择jQuery：

$('select').change(function(){
   x =  $(this).attr('id');

   $('select').each(function () {
    _id = $(this).attr('id');
          if(_id != x)
          {
            **CHANGE BEACK TO DEFAULT COMMAND** -COULDT FIND IY
            }

});



});

HTML：

<select id="1">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select><select id="2">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select><select id="3">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select><select id="4">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

Answer 1

这是什么意思？

$('select').change(function(){
   $('select').not(this).prop('selectedIndex',0);            
});

http://jsfiddle.net/tj4k8eeq/1/

Answer 2

Demo

Matt的解决方案适用于您提供的情况，但这里有一种更强大的方法，如果您通过选项的selected属性设置了默认选项，则会考虑这种方式。

离。 <option selected="selected">Opel</option>

// Reset the other select elements
// When we choose something
$('select').on('change', function() {
    $(this).siblings().prop('selectedIndex', function(index) {
        // Search for a default option
        var $selectedOption = $(this).find('option[selected]');        
        if($selectedOption.length)
            return $selectedOption.index();

        // If there is no default, just reset to the first option
        return 0;
    });

    // Do what you want with the value
    // var value = $(this).val();
    // console.log(value);
});

// Reset the other select elements
// When we choose something
$('select').on('change', function() {
    $(this).siblings().prop('selectedIndex', function(index) {
        // Search for a default option
        var $selectedOption = $(this).find('option[selected]');        
        if($selectedOption.length)
            return $selectedOption.index();
        
        // If there is no default, just reset to the first option
        return 0;
    });
    
    // Do what you want with the value
    var value = $(this).val();
    console.log(value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<select id="1">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
</select>
<select id="2">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
</select>
<select id="3">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
</select>

<br /><br />

Has default value of "Opel":
<br />
<select id="4">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel" selected="selected">Opel</option>
    <option value="audi">Audi</option>
</select>

Jquery-将选择选项设置回其默认选项

2 个答案:

Demo