Question

如果未选中单选按钮，则下面的代码会隐藏一个部分。

if ($('#Items_0__Suffix:checked').val() === 'No') {
        $('#section0').hide();
    }

现在，如果我们有多个项目，编写代码的简洁方法是什么，而不是像下面的代码：

if ($('#Items_0__Suffix:checked').val() === 'No') {
        $('#section0').hide();
    }
if ($('#Items_1__Suffix:checked').val() === 'No') {
            $('#section0').hide();
        }

Answer 1

假设checkbox id的序列以零开头并且具有id也从零开始的相应元素，则可以使用jquery starts with选择器并使用jquery index()来计算要显示的元素/隐藏。

$("[id^=Items_]").on("click",function()
{        
   var index = $(this).index();
   !$(this).is(":checked") ? 
   $('#section' + index).hide() : $('#section' + index).show();
});

示例：https://jsfiddle.net/97bo2vyb/2/

Answer 2

也许是for循环？

for (var i = 0; i <= amountOfButtons; i++) {
    if ($('#Items_' + i + '__Suffix:checked').val() === 'No') {
        $('#section0').hide();
    }
}

甚至在你的选择器中使用Regex也可以做到这一点。

Answer 3

创建一个函数并传入上下文。重用剩余的代码。例如：

Var doWork = function(context) {
       If ($(context).val() == 'No') {
            $('#section0').hide();
       }
 }

通过这种方式，您可以调用相同的函数和代码进行重用，而无需每次都复制它。

Jquery用给定的id模式操纵元素的数量

3 个答案: