Question

我有一个全部勾选框，当用户勾选它时，它下面的所有项目都会被勾选。它在Firefox中运行良好，但不会在chrome中执行Check All功能。

这是JS函数：

function Check(chk, num)   
{   
    if(chk.value=="Check all"){   
        for (i = 0; i <= num; i++){   
            chk[i].checked = true ;   
        }
        chk.value="UnCheck all";   
    }else{

        for (i = 0; i <= num; i++){
            chk[i].checked = false ;
        }
        chk.value="Check all";
    }
}

HTML：

<form target="_blank" action="" method="post" id="myform" name="myform"> 
    <input type="checkbox" value="Check all" onclick="Check(document.myform.Product A, 9)" id="Fujitsu" name="Fujitsu"> Select All 
    <input type="hidden" value="1" name="product_id[1]"> 
    <input type="checkbox" value="Product 1" id="Product 1" name="product[1]">Product A -Product 1 
    <input type="hidden" value="2" name="product_id[2]"> 
    <input type="checkbox" value="Product 2" id="Product 2" name="product[1]">Product A -Product 2 
</form>

Answer 1

对我而言，Firefox和Chromium在“document.myform.Product A”上崩溃。以下是您的代码稍加修改后的工作原理：

function Check(form, all, chk, num)
{
    if(form[all].value=="Check all"){
        for (i = 1; i <= num; i++){
            form[chk + i].checked = true ;
        }
        form[all].value="UnCheck all";
    }else{

        for (i = 1; i <= num; i++){
            form[chk + i].checked = false ;
        }
        form[all].value="Check all";
    }
}

和HTML：

<form target="_blank" action="" method="post" id="myform" name="myform">-
    <input type="checkbox" value="Check all" onclick="Check(document.myform, 'Fujitsu',  'Product_' , 2)" id="Fujitsu" name="Fujitsu"> Select All-
    <input type="hidden" value="1" name="product_id[1]">-
    <input type="checkbox" value="Product 1" id="Product_1" name="product[1]">Product A -Product 1-
    <input type="hidden" value="2" name="product_id[2]">-
    <input type="checkbox" value="Product 2" id="Product_2" name="product[1]">Product A -Product 2-
</form>

但你可以做更干净的代码来做同样的事情：

function Check(form, action)
{
    var l = form.getElementsByTagName("input");
    for (var i = 0; i < l.length; ++i)
        if (l[i].type == "checkbox") l[i].checked = action;
}

和HTML：

<form target="_blank" action="" method="post" id="myform" name="myform">-
    <input type="checkbox" value="Check all" onclick="Check(document.myform, this.checked)" id="Fujitsu" name="Fujitsu"> Select All-
    <input type="hidden" value="1" name="product_id[1]">-
    <input type="checkbox" value="Product 1" id="Product_1" name="product[1]">Product A -Product 1-
    <input type="hidden" value="2" name="product_id[2]">-
    <input type="checkbox" value="Product 2" id="Product_2" name="product[1]">Product A -Product 2-
</form>

如果你使用一个带有CSS选择器的库，比如jQuery会更好。

Check All无法在Chrome中使用，但可在Firefox中使用

1 个答案: