3

別のサブジェクトに複数選択を使用しています。選択を 2 つまでに制限し、ユーザーが選択を解除した場合と同じように他のサブジェクトを無効にします。ユーザーがオプションを使用できるようにする必要があります。

<select multiple="multiple" class="subjects" name="subjects[]" style="float:left;width:205px;" size="5">
  <option value='1'>subject1</option>
  <option value='2'>subject2</option>
  <option value='3'>subject3</option>
  <option value='3'>subject3</option>
</select>

これまでのところ、2 の後に選択された最後のオプションのみを選択解除することができました。コードは次のとおりです。

    /**
     * Make sure the subject's limit is 2
     */
    $(".subjects option").click(function(e){

        if ($(this).parent().val().length > 2) {
            $(this).removeAttr("selected");
        }
    });

ありがとうございました。

4

4 に答える 4

2

RobG の回答の改善として、カウントが 2 を超える場合はオプションの選択を解除できます。

jQuery を使用した実際の例については、 http: //jsfiddle.net/c9CkG/3/を参照してください。

function checkSelected(el) {
  var msgEl = document.getElementById('msg');
  var count = 0;

  for (var i=0, iLen=el.options.length; i<iLen; i++)

      el.options[i].selected? count++ : null;

      // Deselect the option.
      if (count > 2) {
          el.options[i].selected = false;
          el.options[i].disabled = true;

          msgEl.innerHTML = 'Please select only two options';
      }
}
于 2012-08-08T11:11:21.860 に答える
1

次のようなものがその仕事をします：

function checkSelected(el) {
  var msgEl = document.getElementById('msg');
  var count = 0;

  for (var i=0, iLen=el.options.length; i<iLen; i++)
      el.options[i].selected? count++ : null;

  msgEl.innerHTML = count > 2? 'Please select only two options' : '';
}
</script>

<span>Please select a maximum of two options:</span>
<select multiple onchange="checkSelected(this);">
  <option>0
  <option>1
  <option>2
  <option>3
</select>
<br>
<span id="msg"></span>

オプションを無効にするのは良い考えではないと思います。フォームの送信時に2つだけが選択されていることに注意してください。それまでは関係ありません。

于 2012-08-08T11:00:54.417 に答える