在JQuery中使用“最近”禁用單選按鈕

Question

如何使用Closest單擊中間的單選按鈕以禁用兩側的單選按鈕？

<div class="pure-u-1 pure-u-md-1-5">
    <span style="white-space: nowrap;">
    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" value="Yes" name="COM" id="COM0"> 
                Yes &nbsp;&nbsp; 
            </p>
        </label>
    </span>

    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" checked="checked" value="No" name="COM" id="COM1"> 
                No &nbsp;&nbsp; 
            </p>
        </label>
    </span>

    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" value="NA" name="COM" id="COM2"> 
                NA &nbsp;&nbsp; 
            </p>
        </label>
    </span>
    </span>
</div>

在單擊“否”時，我希望禁用“是”和“不適用”單選按鈕，但不希望通過使用任何循環/迭代或禁用靜態Name或ID來實現，而是希望最接近或同級的Jquery方法執行相同的操作。

在JQuery中如何使用它呢？

Answer 1

您可以這樣操作，基本上是采用最接近的<div> ，然后找到所有類型為radio <input> ，但找到“ No”無線電並禁用它們。

$("#COM1").on("click", function() {
    var $no = $(this);
    $no.closest("div").find("input:radio").not($no).attr("disabled", true);
});

看到這個http://jsfiddle.net/4459rqtp/

Answer 2

嘗試這個

此處演示

$('input[type=radio]').on('click',function(){
    $("input:radio").attr('disabled',true);
    $(this).removeAttr('disabled');
});

或僅一行

演示

$('input[type=radio]').on('click',function(){
    $("input:radio").not($(this)).attr('disabled',true);
});