在Javascript中不禁用表中的整行

Not disabling Entire row in table in Javascript

本文关键字：Javascript      更新时间：2023-09-26

我写了一个基于某些条件禁用整行的函数，但对我来说，日期字段没有被禁用。请帮我改正一下。

从这里呼叫

var rowCount = document.getElementById("BLK_CLVWS_COMPSCH").tBodies[0].rows.length;
        if(rowCount > 0)
        {
            for(var i=0; i<rowCount; i++)
            {
                if ((document.getElementById("BLK_CLVWS_COMPSCH").tBodies[0].rows[i].cells[20].getElementsByTagName("INPUT")[0].value)=='N')
                    fnDisablesch(i);
            }
        }

函数

function fnDisablesch(z)
{
        var tblEventRef = document.getElementById("BLK_CLVWS_COMPSCH").tBodies[0];
    var rowRef      = tblEventRef.rows;

        rowRef[z].cells[0].getElementsByTagName("INPUT")[0].disabled = true;
        rowRef[z].cells[1].getElementsByTagName("SELECT")[0].disabled = true;
        rowRef[z].cells[2].getElementsByTagName("SELECT")[0].disabled = true;
        rowRef[z].cells[3].getElementsByTagName("INPUT")[0].disabled = true;
        rowRef[z].cells[3].getElementsByTagName("INPUT")[0].nextSibling.style.visibility="hidden";
                    rowRef[z].cells[4].getElementsByTagName("INPUT")[0].disabled = true;
        rowRef[z].cells[5].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[6].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[7].getElementsByTagName("SELECT")[0].disabled = true;
        rowRef[z].cells[8].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[9].getElementsByTagName("INPUT")[0].disabled = true;
        rowRef[z].cells[10].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[11].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[12].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[13].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[14].getElementsByTagName("INPUT")[0].nextSibling.disabled = true;
        rowRef[z].cells[15].getElementsByTagName("SELECT")[0].disabled = true;
        rowRef[z].cells[16].getElementsByTagName("SELECT")[0].disabled = true;
        rowRef[z].cells[17].getElementsByTagName("INPUT")[0].disabled = true;
        rowRef[z].cells[18].getElementsByTagName("INPUT")[0].disabled = true;
    return true;
}

也许这能帮上忙?

启用/禁用行本身内的所有内容，生成一些假数据来处理

<html>
<head>
  <title>Disable Row</title>
  <script type="text/javascript">
  function setState(element, state) {
    element.disabled = state;
    var children = element.children, i;
    if (children === null || children.length === 0) {
      return;
    }
    for (i = 0; i < children.length; i++) {
      setState(children[i], state);
    }
  }
  function setRowState(tableid, index, state) {
    var table = document.getElementById(tableid);
    if (!table) {
      return;
    }
    var row = table.rows[index];
    if (!row) {
      return;
    }
    setState(row, state);    
  }
  function generateData(tableid) {
    var table = document.getElementById(tableid);
    if (!table) {
      return;
    }
    for (var i = 0; i < 40; i++) {
      var row = document.createElement(i === 0 ? 'th' : 'tr');
      for (var j = 0; j < 10; j++) {
        var cell = document.createElement('td');
        if (i == 0) {
          cell.innerHTML = 'header ' + j;
          row.appendChild(cell);
          continue;
        }
        var input = document.createElement('input');
        input.type = 'text';
        if (j % 3 === 0) {
          input.type = 'date';
        }
        if (j % 4 === 0) {
          input.type = 'button';
        }
        cell.appendChild(input);
        row.appendChild(cell);
      }
      table.appendChild(row);
    }
  }
  function activate(tableid, text) {
    var el = document.getElementById(text).value;
    setRowState(tableid, parseInt(el), false);
  }
  function deactivate(tableid, text) {
    var el = document.getElementById(text).value;
    setRowState(tableid, parseInt(el), true);
  }
  </script>
</head>
<body onload="javascript:generateData('fakedata');">
<input id="rowToUpdate" value="5" /><button id="activate" onclick="javascript:activate('fakedata', 'rowToUpdate');">Activate</button><button id="deactivate" onclick="javascript:deactivate('fakedata', 'rowToUpdate');">Deactivate</button>
<table id="fakedata">
</table>
</body>
</html>
相关文章：