Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Дублирование тестовых полей (https://javascript.ru/forum/misc/18376-dublirovanie-testovykh-polejj.html)

9xakep 28.06.2011 12:31

Дублирование тестовых полей
 
В общем я хочу сделать дублирование текстовых полей,например как здесь:

Когда кликаем по "еще скриншот" появляется еще одно поле,так я хотел сделать тоже самое,но пока не получается...
<input type="text" id="text1" value=""/>
<button onClick="plus()">+</button>
<script>
function plus() {
var i = document.getElementsById("text1")
for(i=1;i<i.lenth+1;i++)
}
</script>

По поводу этого:
for(i=1;i<i.lenth+1;i++)
Я подумал,что можно сделать так:i=1;i больше свое длины +1,то есть получается бесконечность,и по идее можно было бы копировать поля бесконечное количество раз

9xakep 28.06.2011 12:38

в dragon fly:
Syntax error at line 5 while loading:
}
^
expected expression, got '}'

То есть здесь:
на 7 строке в выше лежащем посту

ksa 28.06.2011 12:45

Цитата:

Сообщение от 9xakep
Я подумал,что можно сделать так:i=1;i больше свое длины +1

Это кто так научил? :blink:

"Набросок" скрипта конечно ППЦ!

9xakep 28.06.2011 12:53

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

ksa 28.06.2011 12:58

Цитата:

Сообщение от 9xakep
а как он хотя бы должен выглядеть?

Что-то типа такого...

<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style type="text/css">
#fields {
	position: relative;
	width: 200px;
}
#add {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 30px;
}
input[type='text'] {
	width: 160px;
}
</style>
<script type="text/javascript">
function Add() {
	var o=document.createElement('input')
	o.type='text'
	var od=document.createElement('div')
	od.appendChild(o)
	var oc=document.getElementById('fields')
	oc.appendChild(od)
}
</script>
</head>
<body>
<form>
	<div id='fields'>
		<div>
			<input type="text" />
		</div>
		<input type='button' id='add' value='+' onclick='Add()' /> 
	</div>
</form>
</body>
</html>

Jude 28.06.2011 13:00

Давно в нете нашёл:
<form enctype='multipart/form-data' method=post>
<table>
  <tr>
    <td><input type="file" size="50" name="att[]" class=input></td>
    <td><input type="button" name="drop" value=" &minus; " onclick="dropFile(this);">
        <input type="button" value=" + " onclick="addFile(this);"></td>
  </tr>
</table>
<input class=button type=submit value='Загрузить'>
</form>
<script type='text/javascript'>
function dropFile(btn)
{
  if(document.getElementById)
  {
    while (btn.tagName != 'TR') btn = btn.parentNode;
    btn.parentNode.removeChild(btn);
  }
}
function addFile(btn)
{
  if(document.getElementById)
  {
    while (btn.tagName != 'TR') btn = btn.parentNode;
    var newTr = btn.parentNode.insertBefore(btn.cloneNode(true),
                                            btn.nextSibling);
    thisChilds = newTr.getElementsByTagName('td');
    for (var i = 0; i < thisChilds.length; i++)
    {
      if (thisChilds[i].className == 'files')
      thisChilds[i].innerHTML = '<input size="40" name="att[]" class=input type="file">';
    }
  }
}
</script>

Далеко не идеальный вариант, но написать нормальный скрипт поможет:)

9xakep 28.06.2011 17:21

ksa,Jude,спасибо
И кстати что это такое "appendChild",где можно об этом прочитать?

NoResponse 28.06.2011 17:31

например тут
если нужно по русски и чтоб не далеко, то тут


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