可以't返回动态创建的复选框的值

Can't return value of dynamically created checkbox

本文关键字:创建 复选框 动态 返回 可以      更新时间:2023-09-26

我正在表中创建表单字段,然后使用javascript在表中创建行,并使用所需字段构建行。下面是我的javascript。

function createRow() {  
    for (var i=0;i<rows3;i++){ 
        if (document.getElementById('buID').value==agile1[i]['BU_ID']){
            var rowCount = document.getElementById("mytable").rows.length;
            document.getElementById("rowIDcount").value=rowCount;
            console.log(agile1[i]['Agile_team']);
            x=x+1;
  var row = document.createElement('tr'); // create row node
  var rowid = document.createElement('td');
  var col = document.createElement('td'); // create column node
  var col2 = document.createElement('td'); // create second column node
  var col3 = document.createElement('td');
  var col4 = document.createElement('td');
  var col5 = document.createElement('td');
  var col6 = document.createElement('td');
  row.appendChild(rowid);
  row.appendChild(col); // append first column to row
  row.appendChild(col2); // append second column to row
  row.appendChild(col3);
  row.appendChild(col4);
  row.appendChild(col5);
  row.appendChild(col6);

  var rowids="<input id='row"+x+"'readonly value='"+x+"'>";
  agile="<input  id='agileteams"+x+"'readonly value='"+agile1[i]['Agile_team']+"'>";
  var strategic="<input type='number' min='0' max='100' id='strategic"+x+"'>";
  var Initiatives="<input type='number' min='0'  id='numInts"+x+"'>";
  var NewName="<input id='newname"+x+"'>";
  var deleteTeam="<input type='checkbox' value='1' id='deleteteam'"+x+"''>";
  var RenameTeam="<input type='checkbox' id='renameteam'"+x+"''>";

  rowid.innerHTML=rowids;
  col.innerHTML=agile;
   col2.innerHTML=strategic;
   col3.innerHTML=Initiatives;
   col4.innerHTML=deleteTeam;
   col5.innerHTML=RenameTeam;
   col6.innerHTML=NewName;
  var table = document.getElementById("mytable"); // find table to append to
  table.appendChild(row);
}
}
}

创建行之后,我可以返回文本框的值,但不能返回复选框元素。我正在使用document.getElementByID('deleteteam1').value返回值,但我得到以下错误。

未捕获的类型错误:无法读取空的属性"value"

请记住,如果我使用document.getElementByID('agileteams1').value,它将返回值。

我做错了什么?

您有额外的单引号,这会为您的checkbox元素创建错误的id属性值。因此,当您访问document.getElementByID('agileteams1')时,它将返回null,因为它不存在。我们不能在null 上调用任何方法/属性

更改

var deleteTeam="<input type='checkbox' value='1' id='deleteteam'"+x+"''>";

var deleteTeam="<input type='checkbox' value='1' id='deleteteam"+x+"'>";