Question

我第一次利用 j(我的 knowledge知识最差),并试图根据检查箱选择建立一个科过滤器(hides/show divs依阶层而定)。

首先,我想收回每个检查箱的类别,因此我有这样的情况(四. 文字只是测试产出)。每个检查箱级对应四级(所有四级都有与各种检查箱相匹配的多个班级)

<ul>
    <li>Size</li>
    <li><input type="checkbox" class="half" />&frac12;"</li>
    <li><input type="checkbox" class="quart" />&frac34;"</li>
</ul>

<script>
    function Checked() {
        var n = $("input:checked").attr("class");
        $("div.text").text(n);
    }

    Checked();
    $(":checkbox").click(Checked);
</script>

这令人uc笑皆是地回到了第一个被检查的检查箱子类别,我与每个(或)人 to在一起,但不知道如何执行,有人能否向我指出正确的方向?

最后,我期望每个检查箱级都位于一个阵列中,然后我可以呼吁将相应的零件作为唯一可见的物品,但我很高兴能及时采取这一步骤。我确信,这很可能是取得预期结果的更方便之举,因此也愿意提出建议。预收

Answer 1

引言

function Checked() {
  var classes = [];
  $("input:checked").each(function(){
       classes.push($(this).attr( class ));
  });
  $("div.text").text(classes.join( , ));
}
Checked();
$(":checkbox").click(Checked);

Inside the each loop this points to each of the checked checkbox element. Using this we get the class and then push it inside an array just to store all the classes and then display them using join method of the array.

Answer 2

为此:

function Checked() {
    return $("input:checked").map(function() {
        return $(this).attr("class");
    }).get();
}

function showDivs() {
    var foo = Checked();
    // hide/show divs based on the array returned from the above function
}

showDivs();
$(":checkbox").click(showDivs);

Answer 3

或许需要考虑<代码>.each()的功能,因为收集酒类的物品可能不止一个:

var classString;
$("input:checked").each(function(){
    classString += $(this).attr("class") + " "
});

$("div.text").text(classString);

Answer 4

如果你希望检查箱打开/存放可见的物品,你可以采用这种方式:

传真:

<input type="checkbox" class="half" />&frac12;"
<div class="T_half" style="display:none">...</div>

JS:

$("input:checkbox").click(function() {
        $("T_"+$(this).attr("class")).toggle()
})

Answer 5

这里可以这样做。

<ul>
  <li>Size</li>
  <li><input type="checkbox" class="half" />&frac12;"</li>
  <li><input type="checkbox" class="quart" />&frac34;"</li>
</ul>

<p>Results</p>
<div id="output"><div>

<script>
function Checked() {
    var classes = [];

    // this will be a bit different maybe per the markup
    // though it uses the each function to loop through and
    // get the class of each check element in the selector
    $( ul li input:checked ).each(function(index) {
        classes.push($(this).attr( class ));
    });

    // ... do something ...
    // for now just update the #output html with the classes array content
    $( #output ).html(classes.join( ,  ));
}

Checked();

$(":checkbox").click(Checked);
</script>

友情链接