Question

我正在尝试在按钮点击功能上创建2个文本框和1个选择框，但是当我填充通过单击和另一个单击创建的框时，所有填充的细节都会消失。

我希望我填写的详细信息能够在数据库中发布？

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>Untitled Document</title>
        <script>
            var counter=1;
            function generateRow() {
                var d=document.getElementById("div");
                d.innerHTML+="<p>&nbsp;&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox"+counter+"' name='stop"+counter+"' placeholder='Stop Name'></input></div>&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox"+counter+"' name='timing"+counter+"' placeholder='Timing'></input></div>&nbsp;<div class='_25'><strong>Select Route</strong><select id='ampm"+counter+"'name='ampm"+counter+"'><option>a.m</option><option>p.m</option></select>  </div>";
                counter++;
            }
        </script>
    </head>
    <body>
        <form id="form1" name="form1" method="post" action="">
            <div id="div"></div>
            <p><input type="button" value="Add" onclick="generateRow()"/></p>
            <p>
        </form>
    </body>
</html>

Answer 1

你可以这样试试

var temp ="'<p>&nbsp;&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox"+counter+"' name='stop"+counter+"' placeholder='Stop Name'></input></div>&nbsp;&nbsp;&nbsp;<div class='_25'><input type='textbox' id='textbox"+counter+"' name='timing"+counter+"' placeholder='Timing'></input></div>&nbsp;<div class='_25'><strong>Select Route</strong><select id='ampm"+counter+"'name='ampm"+counter+"'><option>a.m</option><option>p.m</option></select>  </div>'";

var newdiv = document.createElement('div');
newdiv.innerHTML = temp;
var yourDiv = document.getElementById('div');
yourDiv.appendChild(newdiv);

希望它能运作

Answer 2

首先将d.innerHTML转换为另一个变量中的另一个变量和新的html。然后将它们连接起来并保存在innerhtml

中

但是，您应该使用insertBefore或appendChild功能而不是简单的innerHTML进行构建。

如何在点击功能上创建文本框

2 个答案: