Форум

sc2r2bey · #1 (**permalink**) 23.07.2009, 01:11

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

greatilya · #2 (**permalink**) 23.07.2009, 04:32

могу предложить следующий вариант. внутри формы создайте

<div id="div1"></div>

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

document.getElementById('div1').innerHTML='<input type="text" name="text1" value="Введите ваш почтовый индекс" />';

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

MEAT · #3 (**permalink**) 15.06.2010, 15:30

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

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ без имени</title>
<script type="text/javascript">
function add_tr(){
	var i = window.event.srcElement.name.length;
	if (i == 11)
	{
		var j = substr(window.event.srcElement.name, 4);
                j ++;
		var num = document.createElement("<input type='text' name='num_"+j+"' onchange='javascript:add_tr();' />");
		document.body.insertBefore(num);
	}
}
</script>
</head>

<body>
	<input type="text" name="num_0" onchange="javascript:add_tr();" />
</body>
</html>

`p r o x y · #4 (**permalink**) 15.06.2010, 16:20

Пример:

<script type="text/javascript">
function add_input(o){
	var inp2 = document.getElementById( 'input_2' );
	
	if ( o.value.length < 11 ){
		if ( inp2 == null || inp2.style.display == 'none' ) return;
		inp2.style.display = 'none';
		
	} else {
		if ( inp2 != null && inp2.style.display != 'none' ) return;	
		if ( inp2 == null ){
			inp2 = document.createElement( 'input' );
			inp2.type = 'text';
			inp2.name = 'input_2'; 
			inp2.id = 'input_2';
			document.getElementById( 'myForm' ).appendChild( inp2 );
		}
		inp2.style.display = 'block';
	}
}
</script>

<form action="#" id="myForm">
	<input type="text" name="input_1" onkeyup="add_input(this);" />
</form>

Создается новый input, хотя можно просто уже существующий display = none / block.

Форум

Справочник

Discord чат

Курсы javascript