1

複数の選択ボックスがあるページがあります。選択ボックスのいずれかでオプションが選択されたときに、他の選択をデフォルトの状態にリセットできるようにしたいと考えています。ここで例を作成しました：FIDDLE。

しかし、選択したオプションとその親選択ボックスをキャッチするにはどうすればよいですか?

私は次のようなものを試しました：

<div class="selects">
<select>
  <option value="">- Select -</option>
  <option value="1">One</option>
  <option value="2">Two</option>
</select>
</div>
<div class="selects">
<select>
  <option value="">- Select -</option>
  <option value="1">One</option>
  <option value="2">Two</option>
</select>
</div>
<div class="selects">
<select>
  <option value="">- Select -</option>
  <option value="1">One</option>
  <option value="2">Two</option>
</select>
</div>

と：

$('.selects option[selected="selected"]').each(
    function() {
        $(this).removeAttr('selected');
    }
);
$('.selects select').change(function() {
    $(this, "option:first").attr('selected','selected');
});

デフォルトの状態は、常に各選択ボックスの最初のオプションです。

4

3 に答える 3

2

他の選択をリセットするには、現在のセレクターを除外val()し、デフォルトに戻す必要があります。これを試して：

$('.selects select').change(function() {
    $('.selects select').not(this).val('');
});

フィドルの例

于 2013-10-16T09:39:12.340 に答える
0

これは私がjavascript部分を書く方法です..

$('.selects option[selected]').removeAttr('selected');
$('.selects select').change(function(e) {
    // relative lookup
    $(this).parent().siblings().find('select').each(function(e,i){
        $(this).prop("selectedIndex", 0);
    });
});
于 2013-10-16T09:51:51.973 に答える
0

多分このようなもの：

$('.selects select').change(function() {
    $(this).closest("div").prevAll().each(function() {
        $(this).find("select option:first").prop("selected", true);
    })
});

これにより、すべての親選択要素がデフォルト値に設定されます。

于 2013-10-16T09:52:39.720 に答える