Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   количество выводимых input (https://javascript.ru/forum/misc/53564-kolichestvo-vyvodimykh-input.html)

alchin 09.02.2015 11:06

количество выводимых input
 
Здравствуйте, подскажите пожалуйста как реализовать такое:
<input type="text" name="amt"/>
если введено количество 10, то следующие два input
<input type="text" name="size"/>
<input type="text" name="color"/>,
выводятся в таком количестве.
Спасибо

ksa 09.02.2015 11:19

Цитата:

Сообщение от alchin
как реализовать такое

Как вариант сделать "заготовку", а потом клонировать ее указанное количество раз...

alchin 09.02.2015 11:26

как это сделать?

ksa 09.02.2015 11:39

Цитата:

Сообщение от alchin
как это сделать?

Например так...

<!DOCTYPE html>
<html ng-app>
<head>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="http://code.angularjs.org/1.1.4/angular.min.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
.item:last-child {
	display: none;
}
</style>
<script type='text/javascript'>
$(function(){
	$('button').click(function(){
		var n=+$('[name="amt"]').val();
		$('.item:visible').remove();
		for (var i=0; i<n; i++) {
			$('.item:last').before($('.item:last').clone());
		};
	});
})
</script>
</head>
<body> 
<input type="text" name="amt" />
<button>Go</button>
<div id='container'>
	<div class='item'>
		<input type="text" name="size" />
		<input type="text" name="color" />
	</div>
</div>
</body>
</html>

alchin 09.02.2015 12:01

то что нужно, но почему-то перезагружается страница, возможно сделать без перезагрузки?

ksa 09.02.2015 13:18

Цитата:

Сообщение от alchin
но почему-то перезагружается страница

:blink:

В моем примере никакой перезагрузки нет. :no: Это все только у тебя...


Часовой пояс GMT +3, время: 17:50.