Question

我有一个表，其中包含从MySql查询创建的输入行。用户可以更改这些行，但他/她可能还希望添加新行。所以我创建了一个javascript函数，在单击一个按钮时添加一个新行。正在正确创建新行，但输入标记未获取其id或类。

  function addrow(id) {
  var tableref = document.getElementById(id);
  var nextseq  = document.getElementById('maxseq').value;

  var newRow = tableref.insertRow(2);
  var rowid  = "tr"+nextseq;
//first cell
 var cell1 = newRow.insertCell(0) ;
 var text1 = document.createTextNode(nextseq);
 cell1.appendChild(text1);
 var id1   = "cell" + nextseq + "1"; 
 cell1.id = id1;

//second cell
var id2   = "cell" + nextseq + "2";             
var cell2 = newRow.insertCell(1).innerHTML = '<input type = "text" id = id2 class = "xxx"    style = "width:100px" value = "1001-01-01" >';
//  var test = document.getElementById(id2);
//alert("test is " + test); 


    ...more stuff which is working fine ...
 }

警告＆＃34;测试＆＃34;给出＆＃39;测试为空＆＃39;，所以我收集的id没有被设置。

我也试过

var abc = document.getElementsByClassName("xxx");
alert("abc is " + abc);

并且警告说abc是[object HTMLCollection]

如何解决这个问题，以便id和类正常运行？

Answer 1

由于id2是一个变量，你应该这样使用。

 var cell2 = newRow.insertCell(1).innerHTML = '<input type = "text" id =' + id2 + 'class = "xxx"    style = "width:100px" value = "1001-01-01" >';

Answer 2

您需要将变量连接到字符串中。 JS没有字符串插值。

var id2   = "cell" + nextseq + "2";             
var cell2 = newRow.insertCell(1).innerHTML = '<input type = "text" id = ' + id2 + ' class = "xxx"    style = "width:100px" value = "1001-01-01" >';

但是要知道cell2持有字符串，而不是新节点。一个更好的方法来做这个IMO是这样的：

var cell2 = newRow.insertCell(1);
var input = cell2.appendChild(document.createElement('input'));
input.id = "cell" + nextseq + "2"; 
input.className = "xxx";
input.value = "1001-01-01";

然后我会将width:100px;样式信息放在CSS而不是元素上。但如果它必须在那里，那么：

input.style.width = "100px";

alert()提供[HTMLCollection]，因为这是从getElementsByClassName()返回的内容。不确定你要找的是什么输出。

javascript输入标记没有设置id或类

2 个答案: