2

我在jsp中有一个表格。它包含动态 tr。Tr 可以是一个或多个。当只有一个 tr 时出现问题。如果不止一个 tr，所有输入元素也将具有相同的名称。

function getRowIndex( el ) {
            while( (el = el.parentNode) && el.nodeName.toLowerCase() !== 'tr' );
            if( el ) 
            return el.rowIndex - 1;
      }

function enableDisableRow(rowIndex){
           if(document.formName.check_all[rowIndex].checked == true){
                 document.formName.text_all[rowIndex].disabled = false;
           }
}


<table>
   <tr>
      <td>
          <input type="checkbox" name="check_all"       onclick="enableDisableRow(getRowIndex(this))" />
      </td>
          <input type="text" name="text_all" value="Hello" />
      </td>
   </tr>
</table>

问题是document.formName.check_all.checked当只有一行时我会变得未定义。

4

2 回答 2

0

document.formName.check_allnodeList仅当表单中有多个同名元素时才会返回 a ，否则它将简单地返回input元素并在其上使用数组表示法将 return undefined，当您尝试访问其属性时会导致语法错误。

如果您在同一个表单中没有具有相同输入名称的不同表，则可以使用getElementsByNameDOM 方法，该方法将始终返回 a nodeList，或在旧浏览器中兼容的类似数组的结构。

function getRowIndex(el) {
    while ((el = el.parentNode) && el.nodeName.toLowerCase() !== 'tr');
    if (el) return el.rowIndex; //NOTE: I've also removed the -1 here
}
function enableDisableRow(rowIndex) {
    var checkboxes = document.getElementsByName('check_all'),
        textboxes = document.getElementsByName('text_all');

    if (checkboxes[rowIndex].checked) {
        textboxes[rowIndex].disabled = false;
    }
}

Fiddle - 请注意，我仅使用 jQuery 来添加动态行，因此您可以使用单行和多行进行测试。

于 2012-11-02T16:20:40.847 回答
0 
if (document.formName.check_all[rowIndex].checked == true) {
    document.formName.text_all[rowIndex].disabled = false;
}

document.formName.check_all不返回数组或nodeList. 它只是input元素。所以不要在上面使用数组索引。另一个问题是您没有名为 的元素或表单"formName"。试试这个：

function getRowIndex(el) {
    while ((el = el.parentNode) && el.nodeName.toLowerCase() !== 'tr');
    if (el) return el.rowIndex - 1;
}

function enableDisableRow(rowIndex) {
    if (document.formName.check_all.checked == true) {
        document.formName.text_all.disabled = false;
    }
}

和 HTML：

<form name="formName">
    <table name="">
       <tr>
          <td>
              <input type="checkbox" name="check_all" onclick="enableDisableRow(getRowIndex(this))" />
          </td>
           <td>
              <input type="text" name="text_all" value="Hello" />
          </td>
       </tr>
    </table>
</form>​​​​​​​​​​​​
于 2012-11-02T15:58:08.667 回答