Question

第一个用户将输入他想要创建的文本框数量。例如，他从列表中选择4，然后将创建4个文本框在此之后，代码将在php中动态创建文本框并将其值发送到另一个php页面。请帮助完成这项任务。

Answer 1

我会做这样的事情。

<plugin name="Geolocation" value="CDVLocation" />

您可以在这里工作：jsfiddle

非常基本的PHP接收器可以是（myPHPfile.php）：

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
    </head>
    <body>
        <label for="inputTextareasNumber">How many textareas do you want?</label>
        <input type="number" id="inputTextareasNumber" min="1">
        <button type="button" id="butCreateTextareas">Create textareas</button>

        <form id="myDynamicForm" action="myPHPfile.php" method="post"></form>

        <script>
            /* HTML elements caching */
            var inputTextareasNumber = document.getElementById("inputTextareasNumber");
            var butCreateTextareas = document.getElementById("butCreateTextareas");
            var myDynamicForm = document.getElementById("myDynamicForm");

            /* Create textareas when click button */
            butCreateTextareas.addEventListener("click", createTextareas);

            function createTextareas() {
                /* First we empty the form so we can re-create it with a different number of textareas*/
                emptyElement(myDynamicForm);

                /* Here we get the number of textareas we want */
                var textareasNumber = inputTextareasNumber.value;

                /* We create and append to the form as many textareas as number we wrote in the input */
                for (var i = 1; i <= textareasNumber; i++) {
                    var newTextarea = document.createElement("textarea");
                    newTextarea.name = "myTextarea" + i;
                    myDynamicForm.appendChild(newTextarea);
                }

                /* We crate and append the submit button */
                var submitButton = document.createElement("input");
                submitButton.type = "submit";
                submitButton.value = "Send";
                myDynamicForm.appendChild(submitButton);
            }

            /* Empty any HTML element */
            function emptyElement(element) {
                while (element.lastChild) {
                    element.removeChild(element.lastChild);
                }
            }
        </script>
    </body>
</html>

从php

1 个答案: