javascript - 'checkAll'怪異的行爲，當只有一個複選框

Question

我有一塊JavaScript應該檢查或聯合國檢查所有我的複選框（命名相同）..工作正常時，有超過如果只有一個複選框存在，則一個複選框不起作用。 （我意識到在單個選項屏幕上單擊'全部選中'之間的實際區別是相同的，有人可能會爭辯說'全部選中'應該甚至不會出現在屏幕上，只有一個選項 - 但客戶端堅持一致屏幕...所以請不要把我失望，我已經指出的路線）

腳本：

// check uncheck all check boxes 
var checkAll = function(checkname, exby) { 
    alert(checkname.length); // undefined when there is only one check box 
    for (i = 0; i < checkname.length; i++) { 
     checkname[i].checked = exby.checked ? true : false; 
    } 
} 

注 - 我添加了一個警報，以檢查長度，它是不確定的當只有一個複選框時，其他時間是否準確？

不工作的HTML ...

<form method="post" name="createInvoice" > 
    Check/Uncheck All <input name="chkAll" onclick="checkAll(document.createInvoice.PO, this);" type="checkbox" > 
    <input name="PO" value="7835" class="chkbox" type="checkbox" > 
</form> 

，它的HTML ...

<form method="post" name="createInvoice" > 
    Check/Uncheck All <input name="chkAll" onclick="checkAll(document.createInvoice.PO, this);" type="checkbox" > 
    <input name="PO" value="13506" class="chkbox" type="checkbox" > 
    <input name="PO" value="14046" class="chkbox" type="checkbox" > 
</form> 

Answer 1

如果它僅僅是1，那麼它是重要元素，而不是一個數組。

if (!!checkname.length) { 
    for (i = 0; i < checkname.length; i++) { 
     checkname[i].checked = exby.checked ? true : false; 
    } 
} else { 
    checkname.checked = exby.checked ? true : false; 
} 

Answer 2

這是因爲它是如何實施的。

名稱可以在document.getElementsByName（）方法中使用，該方法是一個表單和表單元素集合。當與表單或元素集合一起使用時，它可能會返回單個元素或集合。

See Document Ref

Demo

var checkAll = function(checkname, exby) { 
    if(!checkname.length) 
    { 
     checkname.checked = exby.checked ? true : false; 
     return; 
    } 
    alert(checkname.length); // undefined when there is only one check box 
    for (i = 0; i < checkname.length; i++) { 
     checkname[i].checked = exby.checked ? true : false; 
    } 
} 

Answer 3

我相信，當你有一個複選框名爲 「PO」，然後document.createInvoice.PO將評估與該名稱的單一的DOM元素。當有不止一個，顯然它會給你一個DOM元素的列表，它具有一個length屬性。

所以當只有一個，你沒有得到一個長度。

你可以添加邏輯來處理這兩種情況下：

var checkAll = function(checkbox, exby) { 
    var checkboxes = checkbox.length ? checkbox : [checkbox]; 
    for (i = 0; i < checkboxes.length; i++) { 
     checkboxes[i].checked = exby.checked; 
    } 
};