jQuery的 - 如果不選中其他複選框特定的複選框被用戶

選擇，我想取消所有，如果一個特定的複選框由用戶選擇了目前的複選框的選中。jQuery的 - 如果不選中其他複選框特定的複選框被用戶

例子：

<div> 
    <label for="foo"> 
     <input type="checkbox" name="meh" id="foo" checked> foo 
    </label> 
</div> 
<div> 
    <label for="bar"> 
     <input type="checkbox" name="meh" id="bar" checked> bar 
    </label> 
</div> 
<div> 
    <label for="foobar"> 
     <input type="checkbox" name="meh" id="foobar"> foobar 
    </label> 
</div> 
<div> 
    <label for="barfoo"> 
     <input type="checkbox" name="meh" id="barfoo" checked> barfoo 
    </label> 
</div> 
<div> 
    <label for="omgwtfbbq"> 
     <input type="checkbox" name="meh" id="omgwtfbbq"> omgwtfbbq 
    </label> 
</div>

如果用戶選擇「omgwtfbbq」複選框，我想一切會進行檢查，取消選中，並有「omgwtfbbq」其他框是唯一一個檢查。

來源

2014-01-21 Abela

嘿所有，我解決了與名稱=「」不一致的問題，我修復了for =「」所以它不是id =「」（D'Oh !!!!） – Abela

爲label，而不是id我想你需要for

<div> 
    <label for="foo"> 
     <input type="checkbox" name="foo" id="foo" checked /> foo 
    </label> 
</div> 
<div> 
    <label for="bar"> 
     <input type="checkbox" name="bar" id="bar" checked /> bar 
    </label> 
</div> 
<div> 
    <label for="foobar"> 
     <input type="checkbox" name="foobar" id="foobar" /> foobar 
    </label> 
</div> 
<div> 
    <label for="barfoo"> 
     <input type="checkbox" name="barfoo" id="barfoo" checked /> barfoo 
    </label> 
</div> 
<div> 
    <label for="omgwtfbbq"> 
     <input type="checkbox" name="omgwtfbbq" id="omgwtfbbq" /> omgwtfbbq 
    </label> 
</div>

然後

var $others = $('input[type="checkbox"][name="meh"]').not('#omgwtfbbq') 
$('#omgwtfbbq').change(function() { 
    if (this.checked) { 
     $others.prop('checked', false) 
    } 
}); 
$others.change(function() { 
    if (this.checked) { 
     $('#omgwtfbbq').prop('checked', false) 
    } 
})

演示：Fiddle

注：我將添加一個普通類所有的輸入其具有元件由omgwtfbbq受到影響並改變var $others = $('#foo, #bar, #foobar, #barfoo')到var $others = $('.myclassoninput')

來源

2014-01-21 03:52:11

這就是優勝者！ – m59

但你必須手動列出所有的ID。如果一個新的複選框添加到組合中會怎樣？ – Schien

@Schien只是爲了展示如何選擇複選框......需要根據OP需要對其進行微調...... –

Live demo (click).

$('#omgwtfbbq').click(function() { 
    $('input:checkbox').not(this).attr('checked', false); 
});

另外請注意，你的ID重新使用。 Id只能在文檔中使用一次。

來源

2014-01-21 03:48:36 m59

如果您選擇不給每個複選框順序編號，這樣就可以使用數組，這裏有一個解決方案：

將所有的在一個div控件，用ID「checkgroup」。

然後JavaScript函數雲：

function checkone(d){ 
    if (!d.checked) return; //if it's unchecked, then do nothing 

    var group=document.getElementById('checkgroup'); 
    var os=group.getElementsByTagName('input'); 
    for (var i=0;i<os.length;i++){ 

    if (os[i].checked&&os[i]!=d) os[i].checked=false; 

    } 

}

現在你可以調用這個函數在每個複選框

<div id="checkgroup"> 
    <input id="abcd" onclick="checkone(this);"> 
    <input id="xyz" onclick="checkone(this);"> 
    ... 
</div>

注意如何你甚至都不需要用名字來打擾，因爲對象本身就通過了。

來源

2014-01-21 03:50:54 Schien

jQuery的 - 如果不選中其他複選框特定的複選框被用戶

回答

相關問題