Как добавить input через js

Курсы javascript

а как реализуется добавление элемеента формы, например нужно еще добавить, если не хватило одного и т.д.?

23.07.2009, 04:32
Интернет-турист
Регистрация: 01.08.2008
Сообщений: 516
могу предложить следующий вариант. внутри формы создайте

для вставки туда например текстового поля напишите следующее:

document.getElementById('div1').innerHTML='';

Я привел «любительский метод», он не является примером профессионала. На самом деле делается это через DOM.

__________________
VPS от 175 рублей (есть скидки 15% писать в ПМ) Анализ рынка VPS серверов
Есть только две бесконечные вещи: Вселенная и глупость. Хотя насчет Вселенной я не уверен.

Альберт Эйнштейн
15.06.2010, 15:30
Новичок на форуме
Регистрация: 15.06.2010
Сообщений: 1

Задача в том, чтобы добавить инпут со следующим значением индекса (num_1) после того как введется 11 символов в текущем, и т.д.
гляньте, почему не срабатывает.

   Документ без имени

15.06.2010, 16:20
Кандидат Javascript-наук
Регистрация: 04.05.2009
Сообщений: 105

Добавление input в html через JS

Есть форма, при нажатии на другое должно появляться дополнительное поле через JS. ( на данный момент через display none, но хотелось бы через js. Я пытался реализовать нечего не получилось. Как с помощью innerHTML добавлять в test2 инпут? )

$('.test').click(function(e) < $('.test2').addClass('active'); >); $('.test1').click(function(e) < $('.test2').removeClass('active'); >);

.test2 < display: none; >.test2.active

  Другое
  Основное

Отслеживать

задан 12 мая 2020 в 18:34

345 2 2 серебряных знака 16 16 бронзовых знаков

1 ответ 1

Сортировка: Сброс на вариант по умолчанию

$('.test').click(function(e) < $('.test2').html(''); >); $('.test1').click(function(e) < $('.test2').html(''); >);

  Другое
  Основное

let check1 = document.querySelector(".test > input"); let check2 = document.querySelector(".test1 > input"); let input_box = document.querySelector(".test2"); check1.onclick = (ev) => < if(ev.target.checked) < input_box.innerHTML = ''; setTimeout(() => < document.querySelector(".test2 input").classList.remove('fade-out'); document.querySelector(".test2 input").classList.add('fade-in'); >,1); > > check2.onclick = (ev) => < if(ev.target.checked) < document.querySelector(".test2 input").classList.remove('fade-in'); document.querySelector(".test2 input").classList.add('fade-out'); setTimeout(() =>< input_box.innerHTML = ''; >,1000); > >

.fade-out < opacity: 0; transition: opacity .4s ease-out; >.fade-in

  Другое
  Основное

Как добавить данные из одного input в любой блок (по выбору: 1-ый, 2-ой, 3-ий или 4-ый)?

Нужно сделать возможность добавления текста из элемента input в отдельные блоки. (Сейчас текст выводится из-за заранее выбранного класса (class=»textOutput3″), нужно чтобы пользователь сам выбирал куда ему вывести данные — в 1-ый, 2-ой, 3-ий или 4-ый блок.

Из идей — создать ещё один input с type = «number» или select от 1 до 4 и объединить его с уже имеющимся input который есть, чтобы пользователь писал текст, выбирал цифру и функция на js выводила значение из входных данных (не знаю как реализовать).
Либо просить пользователя ввести в input в начале предложения цифру и функция на js выводила текст в блок согласно цифре которую написал пользователь в начало предложения — 1, 2, 3 или 4 (тоже не знаю как реализовать).

  1. Срочное и важное
 2. Не срочное и важное
 3. Срочное и не важное
 4. Не срочное и не важное

Вопрос задан более года назад
75 просмотров

1 комментарий

Простой 1 комментарий

Добавление инпута через js?

dimovich85

Если на стороне сервера формируете тег скрипт, и хотите, чтобы он добавил инпут когда на клиент придет, то:
1. var inp = » — это просто строка, надо бы заставить js из нее сделать объект DOM, можно это сделать так — $(inp), получим объект DOM в обертке jq; или $(‘#form’).html( inp ); — тогда строка Вашей разметки будет встроена в DOM как просто строка и после этого уже будет добавлена в DOM как надо.
2. Скрипт рискует запуститься до того, как будет построен DOM, так что оберните его еще в window.onload, только желательно через addEventListener.
PS: если на стороне сервера формируете форму, зачем эти танцы с js? Не проще просто echo ‘