0

同じオプションを持つ 4 つselectの入力があります。これらの選択のいずれかから選択されたオプションを無効にしようとしています。

<select name="homeTeams[]" onchange="check()">
    <option value="1">Team1</option>
    <option value="2">Team2</option>
    <option value="3">Team3</option>
    <option value="4">Team4</option>
</select>

<select name="homeTeams[]" onchange="check()">
    <option value="1">Team1</option>
    <option value="2">Team2</option>
    <option value="3">Team3</option>
    <option value="4">Team4</option>
</select>


<select name="awayTeams[]" onchange="check()">
    <option value="1">Team1</option>
    <option value="2">Team2</option>
    <option value="3">Team3</option>
    <option value="4">Team4</option>
</select>

<select name="awayTeams[]" onchange="check()">
    <option value="1">Team1</option>
    <option value="2">Team2</option>
    <option value="3">Team3</option>
    <option value="4">Team4</option>
</select>

これらのセレクターのいずれかから選択されたオプションを無効にしようとしています。私はそれを行うために jQuery を使用していますが、送信者に基づいて値を取得できません。

例: ユーザーが Select 1 から Team1 を選択した場合、jQueryコードは Select2、Select3、および Select4 からオプション Team1 を無効にします。

  function check()
  {
      var a = $('select option:selected').val();
      alert(a);
  }

最初の選択の値が得られます。

何か案は ？

4

2 に答える 2

1

これが私の解決策です-「-select-」の「0」値に注意してください。これにより、任意の値を選択解除できます。

$('select').on('change', function() {
    var vals = {};
    $('select').each(function(i, el) {
        vals[el.value] = 1;
    });
    delete vals[0];

    $('option').prop('disabled', function() {
        return this.value in vals && this.value !== this.parentElement.value;
    });
});​

http://jsfiddle.net/alnitak/Qq33g/のデモ

于 2012-11-18T22:57:37.440 に答える
0

jQuery を使用して、次のようにイベント ハンドラーを登録します。

$('select').change(function() {
    $(this).siblings('select')
           .find('option[value="' + $(this).val() + '"]')
           .attr('disabled', 'disabled');
    $(this).siblings('select')
           .find('option[value!="' + $(this).val() + '"]')
           .removeAttr('disabled');
});

これはうまくいくかもしれません。私はそれをテストしていません。

于 2012-11-18T22:37:48.397 に答える