2013-12-12 15 views
0

這是我正在嘗試實現的 -如何在下拉菜單中爲不同的選項創建不同數量的輸入文本字段?

  • 從下拉菜單中選擇不同的選項。
  • 根據所選的選項輸入不同數量的文本字段。 就像選擇optionA時,它應該爲某些輸入自動創建2個文本區域。 OptionB應該爲輸入創建5個文本字段。

這裏就是我奮鬥 -

  • 無法獲取選項的選項編號或價值選擇
  • 創建可變數量的文本框的。

HTML代碼 -

<body> 


      <p> 
      <select name="Select Flow" id="Flow" >   
       <option id="option0" value="https://fusion.paypal.com">Send Money</option> 
       <option id="option1" value="option1">optionA</option> 
       <option id="option2" value="option2">OptionB</option> 
       <option id="option3" value="option3">C</option> 
       <option id="option4" value="option4">D</option> 
       <option id="option5">E</option> 
       <option id="option6">F</option> 
       <option id="option7">G</option> 
       <option id="option8" value="option8">H</option>   
      </select> 
      </p> 
      <p> 
      <input type="submit" name="Submit" id="Submit" value="Submit" onclick="myfunc()"action="" /> 
      </p> 
</body> 

JS-

function myfunc() 
{ 
var value="F"; 
var t = document.getElementById("Flow"); 
alert((t.options.length).innnerHTML); 
for(var i=0; i<t.options.length;i++) 
{ 
    if(t.options[i].text == value) 
    { 
     t.selectedIndex = i; 
     alert(t.selectedIndex.innerHTML); 
    } 
} 
} 
+0

爲什麼optionA創建2個文本框的一些輸入。 OptionB爲輸入創建5個文本字段.explain plz –

+0

其功能。我打算通過這個在後端觸發一些shell腳本。這些輸入將作爲shell腳本的參數。 – R11G

+0

但輸入的數量也應該出現在您的選項中,嘗試將其添加到您的值中,例如value =「option1_2」並分割該值以獲取輸入的數量 –

回答

0

此代碼可以幫助您

<!DOCTYPE html> 
<html> 
<body> 
<script> 
function myFunction(name,job) 
{ 
alert(document.getElementById("Flow").value); 
write = document.getElementById('textfeilds'); 
for(i=0;i<document.getElementById("Flow").value;i++) 
{ 
write.innerHTML += '<input type="text">'; 
} 
} 
</script> 
    <p> 
     <select name="Select Flow" id="Flow" >   
      <option id="option0" value="4">Send Money</option> 
      <option id="option1" value="1">optionA</option> 
      <option id="option2" value="2">OptionB</option> 
      <option id="option3" value="3">C</option> 
      <option id="option4" value="4">D</option> 
      <option id="option5" value="5">E</option> 
      <option id="option6" value="6">F</option> 
      <option id="option7" value="7">G</option> 
      <option id="option8" value="8">H</option>   
     </select> 
     </p> 
     <p> 
     <input type="submit" name="Submit" id="Submit" value="Submit" onclick="myFunction()"action="" /> 
     </p> 

<div id="textfeilds"></div> 
</body> 
</html> 
相關問題