Как добавлять в форму произвольное количество полей

@Chromeo · Регистрация: 28.10.2012

Студворк — интернет-сервис помощи студентам

Всем доброго дня. Имеется форма следующего вида:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<head>
    <title>Форма заказа такси</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<form action="" method="post">
<p>* Ваше имя:<br />
<input type="text" name="name" class="cme_text" placeholder="Иванов Иван Иванович" /></p>
<p>* Ваш номер телефона:<br />
<input type="text" name="tel" class="cme_txt" placeholder="+7 888 555 44 33" /></p>
<p>* Откуда поедете:<br />
<input type="text" name="ulica" style="cme_txt" placeholder=улица /> <input type="text" name="dom" style="cme_txt" placeholder=дом /> <input type="text" name="pod" style="cme_txt" placeholder=подъезд /></p>
<p>* Куда поедете:<br />
<input type="text" name="ulica1" style="cme_txt" placeholder=улица /> <input type="text" name="dom1" style="cme_txt" placeholder=дом /></p>
<p>* Желаемое время:<br />
<input type="time" name="time" class="cme_txt" /></p>
<input type="submit" value="Отправить" />
</form>
</body>
</html>

По идее можно добавлять несколько пунктов "Куда поедете".

Вопрос: как реализовать автоматическое (по клику мыши, например) добавление сразу двух полей (улица, дом), точнее вот этого участка кода:

HTML5
1
<input type="text" name="ulica1" style="cme_txt" placeholder=улица /> <input type="text" name="dom1" style="cme_txt" placeholder=дом />

п.с. буду очень благодарен, если подскажете как потом всё это извлечь (посредством php).

Всем заранее огромное спасибо!

@OT_VINTA · 11.09.2013, 19:35

HTML5
1
2
<div id="ud" style="display:inline">
<input type="text" name="ulica1" style="cme_txt" placeholder=улица /> <input type="text" name="dom1" style="cme_txt" placeholder=дом /></div><button onclick="addres()">+</button>

JavaScript
1
2
3
4
5
schot = 1;
function addres() {
schot++;
document.getElementById("ud").innerHTML += '</br><input type="text" name="ulica'+schot+'" style="cme_txt" placeholder=улица /> <input type="text" name="dom'+schot+'" style="cme_txt" placeholder=дом />' 
}

Как-то так.

Новые блоги и статьи Все статьи Все блоги /
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20%	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .
Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .	Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .

Опции темы

Как добавлять в форму произвольное количество полей

Решение