1

私はこれを持っています、

<select id="rid" style="border: 1px solid #ccc;" name="rid">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

イベントをトリガーするリンクがあります

<a href="#">Disable Option 1</a><br />
<a href="#">Disable Option 2</a><br />
<a href="#">Disable Option 3</a>

をクリックすると、選択ドロップダウンからDisable Option 1無効になります。Option 1属性を使用して、valueクリックするリンクに関して無効にするオプションを指定できると考えていますが、迷っています。value属性を使用してドロップダウンのオプションを無効にするにはどうすればよいですか?

4

4 に答える 4

9

編集：

たとえば、[オプション 1 を無効にする] をクリックすると、オプション 1、4、および 5 が無効になり、[オプション 2 を無効にする] をクリックすると、オプション 2 と 3 が無効になります。

以下のようにリンクを設定し、

<a href="#" data-val="1,4,5">Disable Option 1</a><br />
<a href="#" data-val="2,3">Disable Option 2</a><br />
<a href="#" data-val="3">Disable Option 3</a>

以下のようにコードを変更し、

$('a').click (function () {
    var thisVal = $(this).data('val')+'';
    $('#rid option').filter(function () {            
        return $.inArray(this.value, thisVal.split(',')) >= 0;
    }).prop('disabled', true);
});

デモ: http://jsfiddle.net/vPhJc/1/

以下のようにリンクを設定すると、

<a href="#" data-val="1">Disable Option 1</a><br />
<a href="#" data-val="2">Disable Option 2</a><br />
<a href="#" data-val="3">Disable Option 3</a>

その後、次のことができます

$('a').click (function () {
    $('#rid option[value=' + $(this).data('val') + ']').prop('disabled', true);
});

デモ: http://jsfiddle.net/vPhJc/

于 2012-10-11T18:31:03.510 に答える
2

こちらをご確認ください

HTML：

<a href="#">Disable Option <span>1</span></a><br />
<a href="#">Disable Option <span>2</span></a><br />
<a href="#">Disable Option <span>3</span></a>

コード：

$("a").click(function(){
   // if you want to enable previously disabled option then do this
   // $("#rid").find("option").removeAttr('disabled');

   $("#rid").find("option[value='"+$(this).find("span").html()+"']")
           .attr('disabled','disabled');
});

http://jsfiddle.net/66hyZ/14/

于 2012-10-11T18:42:40.493 に答える
1

JQuery は、 のような属性値をチェックできるセレクターをサポートしています[name="value"]。

于 2012-10-11T18:30:41.593 に答える
0

各リンクに id を与えてから、id 値を使用して選択ボックスのオプションを無効にしないのはなぜですか

于 2012-10-11T18:37:19.280 に答える