0

jqueryの問題で立ち往生しています..選択した値が「interestingValue」の場合、実際にはすべて(親アイテムを除く他のすべてのアイテムから)を無効にしたい

    <select name="menufoo" id="menufoo" class="menufooClass">
      <option value="interestingValue">bar foo</option>
      <option value="foo1">foo abc1</option>
      <option value="bar1">foo abc1</option>
    </select>

    <select name="menufoo2" id="menufoo2" class="menufooClass2">
      <option value="interestingValue2">bar foo2</option>
      <option value="foo2">foo abc2</option>
      <option value="bar2">foo abc2</option>
    </select>

例:最初のメニューから「interestingValue」を選択すると、

    <select name="menufoo" id="menufoo" class="menufooClass">
      <option value="interestingValue">bar foo</option>
      <option value="foo1">foo abc1</option>
      <option value="bar1">foo abc1</option>
    </select>

    <select name="menufoo2" id="menufoo2" class="menufooClass2">
      <option value="interestingValue2" disabled="disabled">bar foo2</option>
      <option value="foo2" disabled="disabled">foo abc2</option>
      <option value="bar2" disabled="disabled">foo abc2</option>
    </select>

例: 2 番目のメニューから「interestingValue2」を選択すると、

    <select name="menufoo" id="menufoo" class="menufooClass">
      <option value="interestingValue" disabled="disabled">bar foo</option>
      <option value="foo1" disabled="disabled">foo abc1</option>
      <option value="bar1" disabled="disabled">foo abc1</option>
    </select>

    <select name="menufoo2" id="menufoo2" class="menufooClass2">
      <option value="interestingValue2">bar foo2</option>
      <option value="foo2">foo abc2</option>
      <option value="bar2">foo abc2</option>
    </select>

ありがとう :)

4

4 に答える 4

1

選択したタグが兄弟である場合は、次のことを試すことができます。

$('select').change(function(){
  if (this.selectedIndex == 0) {
     $(this).siblings('select').find('option').prop('disabled', true)
  }
})

デモ

于 2012-07-27T18:27:13.937 に答える
0

onchangeイベントを両方の選択項目に添付して、新しい選択値が最初のメニューのinterestingValueおよび2番目のメニューのinterestingValue2と同等であるかどうかを確認できます。.prop()を使用してこれを無効にすることができます。

あなたはこのようなことをすることができます:

$("#menufoo").bind("change", function(event){

  $("#menufoo2").find("option").prop("disabled", ($(this).val() == "interestingValue"));

});

$("#menufoo2").bind("change", function(event){
  $("#menufoo").find("option").prop("disabled", ($(this).val() == "interestingValue2"));
});
于 2012-07-27T18:26:55.730 に答える
0

どうぞ

<script src="jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#menufoo").change(function (){
    if($("#menufoo option:selected").val()=="interestingValue")
        $('.menufooClass2 option').attr('disabled','disabled');
  });
    $("#menufoo2").change(function (){
    if($("#menufoo2 option:selected").val()=="interestingValue2")
        $('.menufooClass option').attr('disabled','disabled');
  });


});
</script>   


   <select name="menufoo" id="menufoo" class="menufooClass">
      <option value="interestingValue">bar foo</option>
      <option value="foo1">foo abc1</option>
      <option value="bar1">foo abc1</option>
    </select>

        <select name="menufoo2" id="menufoo2" class="menufooClass2">
      <option value="interestingValue2">bar foo2</option>
      <option value="foo2">foo abc2</option>
      <option value="bar2">foo abc2</option>
    </select>
于 2012-07-27T18:40:25.487 に答える
0

よくわかりませんが、こんな感じです。

$('[id^=menufoo]').on('change', function() {
    if (this.value.indexOf('interestingValue') != -1 ) {
        $('[id^=menufoo]').not(this).find('option').prop('disabled', true);
    }else{
        $('[id^=menufoo]').find('option').prop('disabled', false);
    }
});​

フィドル

于 2012-07-27T18:25:43.157 に答える