Добавяне на ново поле

bassman

Registered
Примерно имам поле и бутон с които качвам дадени файлове,та въпроса ми е как например с натискане на надписа добави още полета и се появяват още едни поле и бутон със същата функция ?
 
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Formr</title>

<script type="text/javascript">
var arrInput = new Array(5);
  var arrInputValue = new Array(5);

function addInput() {
  arrInput.push(arrInput.length);
  arrInputValue.push("");
  display();
}

function display() {
  document.getElementById('parah').innerHTML="";
  for (intI=5;intI<arrInput.length;intI++) {
    document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
	for (i=0;i<4;i++) {
  	return "<p>Text Box "+ id +": <input type='text' id='textBox"+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"' size='20'></p>";
	}
}

</script>

</head>
<body>


	<form action="" method="post" name="form" id="form">
		<p>Text Box 1: <input name="textBox1" type="text" size="20"></p>
		<p>Text Box 2: <input name="textBox2" type="text" size="20"></p>
		<p>Text Box 3: <input name="textBox3" type="text" size="20"></p>
		<p>Text Box 4: <input name="textBox4" type="text" size="20"></p>
    <p id="parah"> </p>
		<p><a href="javascript:addInput()">Add more input field(s)</a>     <input name="submitBtn" type="submit" value="Submit"></p>
	</form>
</body>
</html>

Не съм го тествал, копирам направо от тук -> http://csscreator.com/node/30774
 
Я пробвай това:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var arrInput = new Array(0);
  var arrInputValue = new Array(0);

function addInput() {
  arrInput.push(arrInput.length);
  arrInputValue.push("");
  display();
}

function display() {
  document.getElementById('parah').innerHTML="";
  for (intI=0;intI<arrInput.length;intI++) {
    document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
  return "<input type='file' id='test "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'><br>";
}

function deleteInput() {
  if (arrInput.length > 0) { 
     arrInput.pop(); 
     arrInputValue.pop();
  }
  display(); 
}

</script>
</head>

<body>
<p id="parah">Добавете автомартично полета за избор</p>

<a href="javascript:addInput()">Добави още полета)</a><br>
<a href="javascript:deleteInput()">Премахни полета</a>
</body>
</html>
 
devent каза:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Formr</title>

<script type="text/javascript">
var arrInput = new Array(5);
  var arrInputValue = new Array(5);

function addInput() {
  arrInput.push(arrInput.length);
  arrInputValue.push("");
  display();
}

function display() {
  document.getElementById('parah').innerHTML="";
  for (intI=5;intI<arrInput.length;intI++) {
    document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
	for (i=0;i<4;i++) {
  	return "<p>Text Box "+ id +": <input type='text' id='textBox"+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"' size='20'></p>";
	}
}

</script>

</head>
<body>


	<form action="" method="post" name="form" id="form">
		<p>Text Box 1: <input name="textBox1" type="text" size="20"></p>
		<p>Text Box 2: <input name="textBox2" type="text" size="20"></p>
		<p>Text Box 3: <input name="textBox3" type="text" size="20"></p>
		<p>Text Box 4: <input name="textBox4" type="text" size="20"></p>
    <p id="parah"> </p>
		<p><a href="javascript:addInput()">Add more input field(s)</a>     <input name="submitBtn" type="submit" value="Submit"></p>
	</form>
</body>
</html>

Не съм го тествал, копирам направо от тук -> http://csscreator.com/node/30774

мерси стана +1
 

Back
Горе