Question

我想动态添加表格行。我试过在线解决方案，但没有运气我的代码：

<script type="text/javascript">
	var index = 2;
	var chr = 68;
    function insertRow(){
                var table=document.getElementById("myTable");
                var row=table.insertRow(table.rows.length);
                var cell1=row.insertCell(0);
                var t1=document.createElement("input");
                	t1.setAttribute('name', "sigID"+index);
                    t1.setAttribute('value',  char(chr));
                    t1.setAttribute('size', 10);
                    cell1.appendChild(t1);
                var cell2=row.insertCell(1);
                var t2=document.createElement("input");
                	t2.setAttribute("type","text");
                	t2.setAttribute('name',"pattern"+index);
                    t2.setAttribute('size',10);
                    t2.setAttribute('colspan',2);
                    cell2.appendChild(t2);
          index++;
          chr++;

    }
	</script>

我在HTML中添加了一个默认行，然后在点击添加时我想根据需要添加行。 HTML页面：

<table id="myTable" style="margin-left:201px;">
  <tr>
    <th>SigID</th>
    <th colspan="2">Patterns</th>
  </tr>
  <tr>
    <td>
      {!!Form::text('sigID1','A',array('size'=>'5'))!!}
    </td>
    <td colspan="2">
      {!!Form::text('pattern1','',array('size'=>'102'))!!}
      <input type="button" class="btn btn-primary btn-md" onclick="insertRow()" value="Add">
    </td>
  </tr>
</table>

请告诉我此代码中的错误。

Answer 1

变化：

t1.setAttribute('value', char(chr));

为：

t1.setAttribute('value', String.fromCharCode(chr));

DEMO

Answer 2

此行中有错误：

t1.setAttribute('value',  char(chr));

char不是Javascript函数。

我认为你想要这个：

String.fromCharCode(chr)

将以上行更改为：

t1.setAttribute('value', String.fromCharCode(chr));

Answer 3

我总觉得这个网站很有用，你可以看看给定的例子 http://www.w3schools.com/jsref/met_table_insertrow.asp

如何在javascript中动态添加表

3 个答案: