JQuery的綁定click事件檢查框

這裏是什麼我的HTML看起來像一個基本觀點：JQuery的綁定click事件檢查框

<form> 
    <div id="part1"> 
    // some html form elements including checkboxes 
    </div> 
    <div id="part2"> 
    // more html code with more checkboxes 
    </div> 
    <div id=part2"> 
    // data table with numerous checkboxes built dynamically 
    </div 
</form>

我需要做的是.click()事件的複選框綁定部分1，2，3 seperately。我試過這個$('#part1:checkbox').click(...)但這沒有奏效。如果我使用$("form :checkbox").click(...)相同的點擊事件綁定到所有複選框，而不僅僅是一組。我將如何分離這些？

來源

2012-06-27 iJared

你快到了。你只需要一個空間給後代選擇分開：

$('#part1 :checkbox').click(function(){ 
    // code goes here 
});

爲了提高性能，您可能想使用此：

$('#part1 input[type=checkbox]').click(function(){ 
    // code goes here 
});

來源

2012-06-27 23:04:55

呃..空間差異使mahalos – iJared

如何使用輸入[type = checkbox]提高性能？ – iJared

@Jared - 'input [type = checkbox]'是一個有效的CSS選擇器。 checkbox'：如果可能，jQuery將沿至['querySelectorAll']（https://developer.mozilla.org/en/DOM/Document.querySelectorAll），這比jQuery的自己的實現的'有效得多通過選擇器。 –

使用此：

$('#part1 input:checkbox').click(...)

http://api.jquery.com/checkbox-selector/

來源

2012-06-27 23:06:41

或者您爲所有複選框提供相同的類名並給出相應的div ID對於複選框也是如此，所以你可以使用下面的代碼，

<input type="checkbox" class="checkall" id="part1">Part 1

你的腳本是這樣的。

$('.checkall').click(function() { 
if (this.checked == false) { 
$("." + $(this).attr("id")).hide(); 
} 
});

來源

2014-05-19 06:59:39 user3512003

我有一個類似的問題，這個StackOverflow頁面是我偶然發現的第一個答案，但並不真正滿意它。我發現這篇文章https://www.kevinleary.net/jquery-checkbox-checked/有一個更好的解決方案。

$('input[name="subscribe"]').on('click', function(){ 
    if ($(this).is(':checked')) { 
     $('input[name="email"]').show(); 
    } 
    else { 
     $('input[name="email"]').hide(); 
    } 
});

來源

2017-12-13 15:01:55

JQuery的綁定click事件檢查框

回答

相關問題