Question

我编写了一个脚本，根据选中的复选框显示/隐藏div。我在下面写的代码工作得很好，但是......

有没有办法缩短这段代码，而不必为每个额外的复选框/ div重复if / else语句，我需要添加？

$(function() {
    $("#submit_button").click(function(){
        if ($("input[value='poster1']:checked").val()){
            $("#results1").show();
        }
        else {
            $("#results1").hide();
        }
        if ($("input[value='poster2']:checked").val()){
            $("#results2").show();
        }
        else {
            $("#results2").hide();
        }
        if ($("input[value='poster3']:checked").val()){
            $("#results3").show();
        }
        else {
            $("#results3").hide();
        }

});

Answer 1

$("#submit_button").click(function() {
    $('input').each(function(i,el){
        var $el = $(el),
            num = $el.val().match(/poster(\d*)/)[1];
        if ($el.filter(':checked').length) {
            $('#results'+num).show();
        } else {
            $('#results'+num).hide();
        }
    });
});

Demo →

缩短多个div /复选框的jQuery

1 个答案: