Question

我使用JavaScript通过单击按钮在jsp中添加下拉，但不知何故它不起作用。有人可以帮帮我吗。我需要使用html：select tag。

<script language="JavaScript" type="text/javascript">
    function addRow() {
        var mytbody = document.getElementById('mytbody');
        var row = document.createElement('tr');
        var cell1 = document.createElement('td');

        cell1value='';
        cell1value+='<html:select property="test1" styleId="test1"> <html:option value="code1">test 1</html:option> </html:select>';    
        cell1.innerHTML = cell1value;       

         row.appendChild(cell1);    
         mytbody.appendChild(row);
    }
</script>

html代码：

<table id="mytable">
<tbody id="mytbody">
<tr>
    <td>test1</td>
</tr>
</tbody>
</table>

<input type="button" onclick="addRow()" value="test"/>
</form>
</body>
</html>

感谢您的帮助

Answer 1

我做了一个jsfiddle来检查它...我想你可能只需要在head标签中有这个javascript。

使用F12开发人员工具，并在单击按钮时尝试调试问题。您可能会发现addRow（）未定义。

由于我不熟悉JSP，我也改变了一点代码 - 对不起！这是什么

"<html:select..."

字符串是？我把它改成了直接的HTML。

http://jsfiddle.net/e7z1efgr/

function addRow() {
  var mytbody = document.getElementById('mytbody');
  var row = document.createElement('tr');
  var cell1 = document.createElement('td');

  var cell1value = '';
  cell1value += '<select class="text1"><option value="code1">test 1</option></select>';
  cell1.innerHTML = cell1value;

  row.appendChild(cell1);
  mytbody.appendChild(row);
}

<table id="mytable">
  <tbody id="mytbody">
    <tr>
      <td>test1</td>
    </tr>
  </tbody>
</table>
<input type="button" onclick="addRow()" value="test" />
</form>
</body>

</html>

Answer 2

您的问题是您插入的奇怪HTML：

'<html:select property="test1" styleId="test1"> <html:option value="code1">test 1</html:option> </html:select>'

应该是

'<select property="test1" styleId="test1"> <option value="code1">test 1</option> </select>'

Answer 3

目的是什么？如果你只需要在表格中插入行，它就可以了：

Look here:

http://codepen.io/anon/pen/NGNJrV

你能详细说明这个问题吗？

innerHTML和html：select标签

3 个答案: