Question

所以我想要将这段代码插入到我的网站中。

<table border="1">
<col width="130">
<col width="80">
<tr>
    <td align = "right">Steps:</td><td align="center">Add as many steps as you need</td>
</tr>
<tr>
    <td align = "right">Step 1:</td> <td><textarea style="width: 300px" class="form-control" name="steps[]" rows="3"></textarea></td>
</tr>
<tr>
    <td align = "right">Step 2:</td> <td><textarea style="width: 300px" class="form-control" name="steps[]" rows="3"></textarea></td>
</tr>
<!--<tr>
    <td align = "right">Step 3:</td> <td><textarea style="width: 300px" class="form-control" name="steps[]" rows="3"></textarea></td>
</tr>
<tr>
    <td align = "right">Step 4:</td> <td><textarea style="width: 300px" class="form-control" name="steps[]" rows="3"></textarea></td>
</tr>
-->
</table>

在大多数情况下，我有一些注释，因为我正在测试，以确保我的网站可以处理多个文本框但但我有的问题是如何使用PHP将步骤插入我的网站？我有这些所有的.php文件，以防你想知道，但我想插入更多的盒子，当前框下面的按钮。每次用户单击它时，它应在当前框下方插入另一个框并相应地更新该编号。我不知道从哪里开始以及如何让他们进去。有什么想法吗？

Answer 1

如果您不想在添加新框后重新加载页面，可以使用JavaScript / JQuery添加这些新框。我真的建议看看这个，而不是试图用PH。

如果你真的想用php做，你必须有一个表单中的提交按钮

所以添加类似的东西

<form method="post" action="?">
    <input type="submit" name="submit" value="add row">
</form>

现在是PHP部分：

if(isset($_POST['submit'])) {
    echo " [your usual tr-td-structure] ";
}

请记住，重新加载页面后，变量将失去其值。因此，如果你想要计算，你必须使用javascript（或以某种方式确定哪个Step是当前的并将其插入echo）。当然，在表单内的隐藏字段中设置最后一步（或将其附加为get-param）。

Answer 2

您可以使用以下代码在JS和jQuery中创建新元素：

<强> HTML

<button id="addButton">Add me!</button>

<强> JS

var stepCounter = 3; //Number of the first step to be added
$('#addButton').click(function () {
    var tr = document.createElement("tr");
    var td1 = document.createElement("td");
    var td2 = document.createElement("td");
    var textarea = document.createElement("textarea");
    $(textarea).attr("name", "steps[]");

    $(td1).innerHTML("Step " + stepCounter);    
    stepCounter++;

    $(tr).append(td1);
    $(tr).append(td2);
    $(td2).append(textarea);

    $('#giveTheColAnId').append(tr);
});

请记住为此解决方案包含jQuery

请注意，此代码可能不完美，但它应该会给你一个很好的开始。

Answer 3

你能使用Jquery吗？你能做这样的事吗？

$(document).ready(function(){
   $('#myButton').click(function(){
   $(':input').append('<input type="textbox">');
   });
   });

如何使用php添加更多文本框到页面？

3 个答案: