Question

我有一个带有onclick功能的表格。点击后我收到以下错误： Uncaught TypeError: Cannot set property 'className' of undefined

奇怪的是，class中的3行中的3行已更改，但2/5未更改。再次单击该行时，其余两个中的一个将更改，再次单击时将更改最后一个。这是我的代码：

HTML表格

<tr class='invoice-tr-standard row5' onClick="FormTRClick(event, '6', '5')"><td><input type='checkbox' name='strFormFactuur[]' value='19500' id='chk6'>&nbsp;<img src='../images/link.png' border='0'></td>    
    <td><img src='../images/b_save.png' border='0' height='13px' style='cursor: pointer;' onClick="saveData('6', '?iID=19500&bType=0', 'all');")> <input type='image' src='../images/toevoegen.png' border='0' style='float: right; cursor: pointer;' name='FormDupliceer' value='19500'></td>    
</tr>
<tr class='invoice-tr-standard row5' onClick="FormTRClick(event, '7', '5')"><td></td>    
    <td><img src='../images/b_save.png' border='0' height='13px' style='cursor: pointer;' onClick="saveData('7', '?iID=36&bType=1', 'fltBedrag');"> <input type='image' src='../images/b_delete.png' border='0' style='float: right; cursor: pointer;' name='FormVerwijder' value='36'></td>    
</tr>
<tr class='invoice-tr-standard row5' onClick="FormTRClick(event, '8', '5')"><td></td>    
    <td><img src='../images/b_save.png' border='0' height='13px' style='cursor: pointer;' onClick="saveData('8', '?iID=37&bType=1', 'fltBedrag');"> <input type='image' src='../images/b_delete.png' border='0' style='float: right; cursor: pointer;' name='FormVerwijder' value='37'></td>    
</tr>
<tr class='invoice-tr-standard row5' onClick="FormTRClick(event, '9', '5')"><td></td>    
    <td><img src='../images/b_save.png' border='0' height='13px' style='cursor: pointer;' onClick="saveData('9', '?iID=38&bType=1', 'fltBedrag');"> <input type='image' src='../images/b_delete.png' border='0' style='float: right; cursor: pointer;' name='FormVerwijder' value='38'></td>    
</tr>
<tr class='invoice-tr-standard row5' onClick="FormTRClick(event, '10', '5')"><td></td>    
    <td><img src='../images/b_save.png' border='0' height='13px' style='cursor: pointer;' onClick="saveData('10', '?iID=66&bType=1', 'fltBedrag');"> <input type='image' src='../images/b_delete.png' border='0' style='float: right; cursor: pointer;' name='FormVerwijder' value='66'></td>    
</tr>

javascript函数FormTRClick()：

function FormTRClick(event, uID, PCID) {
    var Object= event.target.tagName;   
    if (Object == 'TD') {
        var Elements = document.getElementsByClassName('row' + PCID);
        var iNumElements = Elements.length;
        alert(iNumElements); // Outputs 5 as expected
        for (var i=0; i < iNumElements; i++) {
            Elements[i].className = "invoice-tr-clicked"; // Only changes 3 out of 5 on the first click         
        }
    }
}

更新

使用以下Elements[i].className += " invoice-tr-clicked";代替Elements[i].className = "invoice-tr-clicked";时，脚本可以正常工作。但是当替换（因此=）时，我得到Cannot set property 'className' of undefined错误。

Answer 1

我已经通过替换

来修复它

 Elements[i].className = "invoice-tr-clicked";

与

 Elements[i].className = "invoice-tr-clicked row" + PCID;

现在没有任何意义，因为demo没有问题。

Javascript：未捕获的TypeError：无法设置未定义的属性'className'

1 个答案: