Question

我想在我的jsp页面中使用javascript，以便将输入框的值插入表格行。

我的Jsp页面： -

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Title</title>

    <script type="text/javascript">
        function addData(){
            var x = 1;
            var a = document.getElementById('area').value; 

            var table = document.getElementByTagName('table')[0];

            var row = table.insertRow(table.rows.length);

            var cell1 = row.insertCell(0);
            var cell2 = row.insertCell(1);

            cell1.innerHTML = x++;
            cell2.innerHTML = a;
        }
    </script> 

</head>

<body>
    <h2>Area...</h2>
    Area: <input type="text" id="area" name="area" required/><label>sq. ft.
    <button onclick="addData();">Add To Table</button>
    </br></br> 


        <div>
            <h2>Area Table...</h2>
            <table border="1">
                <tr>
                    <th>Section</th>
                    <th>Area</th>
                </tr>
                <tr>
                    <td>1</td>
                    <td>125.4485</td>
                </tr>
            </table>
        </div>
    </body>
</html>

这里我想从输入框中向表中插入一行。但是没有插入值。

代码中是否有任何问题。

Answer 1

使用浏览器的控制台开发人员工具查看错误，
这是错误：

未捕获的TypeError：document.getElementByTagName不是函数 at addData（a.html：11）在HTMLButtonElement.onclick（a.html：28）

这意味着javascript无法识别此功能，因此您必须查看正确的功能表示法

的getElementsByTagName

Answer 2

<强>错字

试试这样，TagName是多重选择器。你遗漏了s

var table = document.getElementsByTagName('table')[0];

而不是

 var table = document.getElementByTagName('table')[0];

＆＃13;

function addData() {
  var x = 1;
  var a = document.getElementById('area').value;

  var table = document.getElementsByTagName('table')[0];

  var row = table.insertRow(table.rows.length);

  var cell1 = row.insertCell(0);
  var cell2 = row.insertCell(1);

  cell1.innerHTML = x++;
  cell2.innerHTML = a;
}

＆＃13;

<h2>Area...</h2>
Area: <input type="text" id="area" name="area" required/><label>sq. ft.
    <button onclick="addData();">Add To Table</button>
    </br></br> 


        <div>
            <h2>Area Table...</h2>
            <table border="1">
                <tr>
                    <th>Section</th>
                    <th>Area</th>
                </tr>
                <tr>
                    <td>1</td>
                    <td>125.4485</td>
                </tr>
            </table>
        </div>

＆＃13;

Answer 3

请将拼写 getElementByTagName 更正为 getElementsByTagName

Javascript函数在jsp页面中不起作用

3 个答案: