1

チェックボックスをラジオボタンとして作成し、さらに選択を解除できる関数を作成しました。私が遭遇している問題は、同じボックスが2回目に少し速くクリックされた場合（高速のダブルクリックではない）、イベントをキャッチしていないなど、何も実行されないことです。

それらは名前を共有する2の倍数になります。

checkbox name 1
checkbox2 name 1

checkbox3 name 2
checkbox4 name 2 ....

これは私の機能です、それはそのグリッチを除いてうまく機能します。

$('#MyDiv').find('input[type="checkbox"]').click(function() {
    if (!$(this).is(':checked')) {
        $(this).prop('checked', false);
        return;
    }
    $('#MyDiv').find('input[type="checkbox"][name=' + $(this).attr('name') + ']').each(function() {
        $(this).prop('checked', false);
    });
    $(this).prop('checked', true);
});

HTMLの例：

<div id="MyDiv">
    <div>
        <p>
            <input id="MyDivUsage_Yes" type="checkbox" name="MyDivUsage"  />
            <label for="MyDivUsage_Yes">Yes</label>
            <input id="MyDivUsage_No" type="checkbox" name="MyDivUsage" />
            <label for="MyDivUsage_No">No</label>
        </p>

    </div>
</div>​

何らかの理由で、jsfiddleでは機能しません。

4

2 に答える 2

1

私はそれが少なくともより効率的であると推測しています:

$('#MyDiv').find('input[type="checkbox"]').on('click', function() {
    $('input[type="checkbox"][name="'+$(this).attr('name')+'"]').not(this).prop('checked', false);
});​

フィドル

またはもう少しネイティブ JS:

$('input[type="checkbox"]', '#MyDiv').on('click', function() {
    var boxes = document.getElementsByName(this.name);
    for (var i=0; i<boxes.length; i++) {
        if (boxes[i] != this) boxes[i].checked = false;
    }
});​

フィドル

于 2012-12-14T08:31:02.363 に答える
1

これを試して：

var checked = {};
    $('.desectable-radio').each(function (index) {
        checked[index] = this.checked;
        $(this).click(function () {
            if (checked[index])
                this.checked = false;
            for (var i in checked) {
                checked[i] = false;
            }
            checked[index] = this.checked;
        });
    });

フィドル: http://jsfiddle.net/dFDeX/1/

于 2012-12-14T08:34:05.840 に答える