используя JavaScript для добавления полей формы ... но ниже, а не в сторону? - PullRequest
0 голосов
/ 23 декабря 2009

Так что, когда я нажимаю кнопку, JavaScript добавляет новые поля. В настоящее время он добавляет новое текстовое поле в сторону ... Есть ли способ сделать это добавить ниже? Я думаю, как будто были
. Вот код Спасибо!

<html>
<head>
    <script type="text/javascript">
        var instance = 1;

        function newTextBox(element)
        {       
            instance++; 
            var newInput = document.createElement("INPUT");
            newInput.id = "text" + instance;
            newInput.name = "text" + instance;
            newInput.type = "text";
            //document.body.write("<br>");
            document.body.insertBefore(newInput, element);
        }
    </script>
</head>


<body>
    <input id="text2" type="text" name="text1"/> <br>
    <input type="button" id="btnAdd" value="New text box" onclick="newTextBox(this);" />
</body>

Ответы [ 4 ]

2 голосов
/ 23 декабря 2009

Вставьте тег <br/> перед вставленным вводом или, что еще лучше, поместите ввод в div и управляйте его внешним видом с помощью CSS.

0 голосов
/ 23 декабря 2009

Вы можете либо вставить элемент br после нового ввода, либо обернуть его внутри элемента div:

function newTextBox(element) {                
    instance++; 
    var newInput = document.createElement("INPUT"); 
    newInput.id = "text" + instance; 
    newInput.name = "text" + instance; 
    newInput.type = "text"; 

    var div = document.createElement('div'); 
    div.appendChild(newInput); 
    document.body.insertBefore(div, element); 
} 

Проверьте приведенный выше пример здесь .

0 голосов
/ 23 декабря 2009

Просто создайте элемент <br> таким же образом и поместите его между ними.

var newBr = document.createElement("BR");
document.body.insertBefore(newBr, element);

Или используйте CSS. Значение display:block может иметь значение.

0 голосов
/ 23 декабря 2009

Добавьте это в конец вашей функции:

document.body.insertBefore(document.createElement("br"), element);

Полный код:

<html>
<head>
        <script type="text/javascript">
                var instance = 1;

                function newTextBox(element)
                {               
                        instance++; 
                        var newInput = document.createElement("INPUT");
                        newInput.id = "text" + instance;
                        newInput.name = "text" + instance;
                        newInput.type = "text";
                        //document.body.write("<br>");
                        document.body.insertBefore(newInput, element);

                        document.body.insertBefore(document.createElement("br"), element);
                }
        </script>
</head>


<body>
        <input id="text2" type="text" name="text1"/> <br>
        <input type="button" id="btnAdd" value="New text box" onclick="newTextBox(this);" />
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...