jQuery:如何仅选择可见和选中的复选框? [英] jQuery: how can I select only the checkboxes that are visible and checked?

问题描述

我试图检查某个系列中的所有可见复选框是否都已选中，我想到的只是对可见的，可见的和检查的数字进行计数，以查看数字是否相同.问题是我无法看到可见的或选中的选择器.

I'm trying to check whether or not all the visible check boxes in a certain series are checked and i thought of just counting those that are visible and those that are visible and checked to see if the numbers are the same. The problem is I can't get the visible nor the checked selectors to work.

这些是我有但没有用的一些想法:

These are some of the ideas I had but didn't work:

if($j("input[id^='chk_camp']:visible:checked").length == $j("input[id^='chk_camp']:visible").length)

在这种情况下，双方均为0

both sides are 0 in this case

if($j("input[id^='chk_camp']").filter(':visible').filter(':checked').length == $j("input[id^='chk_camp']").filter(':visible').length)

双方都返回0.

也尝试过

if($j("input[id^='chk_camp'][visible][checked]").length == $j("input[id^='chk_camp'][visible]").length)

，并且两边都返回0.

请注意，$j("input[id^='chk_camp']").length返回正确的值.我正在使用的浏览器也是Firefox.

As a note $j("input[id^='chk_camp']").length returns the correct value. Also the browser I'm working with is Firefox.

我在做什么错了?

答案:显然我做错了什么.在实际使包含复选框的div可见之前，我已经进行了这些检查，因此所有可见性检查都返回false.

Answer: Aparently what I'm doing wrong is somewhere else. I was doing these checks before actually making the div containing the checkboxes visible so all the visibility checks were returning false.

推荐答案

您可以执行以下操作:

jsfiddle

jsfiddle

jQuery:

$('input').each(function() {

    // If input is visible and checked...
    if ( $(this).is(':visible') && $(this).prop('checked') ) {

        $(this).wrap('<div />');

    }

});

HTML:

<input type="checkbox" checked="checked">
<input type="checkbox" checked="checked" style="display: none;">
<input type="checkbox">
<input type="checkbox" checked="checked" style="display: none;">
<input type="checkbox" checked="checked">
<input type="checkbox">

CSS:

div { float: left; background: green; }
div input { display: block !important; }

这篇关于jQuery:如何仅选择可见和选中的复选框?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！