javascript中的變量，自動填充表格

我在接收來自JavaScript腳本的8個以上值時出現問題...它應該自動填充下拉選項（select）上的字段，但它確實工作正常，但我無法獲得超過8個值...問題在哪裏？謝謝！javascript中的變量，自動填充表格

<script type="text/javascript"> 
    // Format of StoreDetails() 
    // Name,Addr1,Addr2,Addr3,Phone,FAX,Email,Webpage, Url 
    var StoreDetails = [ 
     ['Please select','','','','','','','',''], 
     ['Please select','test1','test2','test3','test4','test5','test6','test7','test8'] 
     // Note: no comma 
    ]; 
    function Setup(TA) { 
     var str = "<select id='Store' class='styled-select' onchange='StoreInfo()'>"; 
     for (var i=0; i<StoreDetails.length; i++) { 
      str += '<option value="'+StoreDetails[i].join('|')+'">'+StoreDetails[i] [0]+'</option>'; 
     } 
     str +='</select>'; 
     document.write(str); 
    } 
    function StoreInfo() { 
     var sel = document.getElementById('Store').selectedIndex; 
     var tmp = []; tmp.push(sel); 
     for (var i=1; i<8; i++) { 
      tmp.push(StoreDetails[sel][i]); 
     } 
     document.getElementById('txtName').value = tmp[1]; 
     document.getElementById('txtAddr1').value = tmp[2]; 
     document.getElementById('txtAddr2').value = tmp[3]; 
     document.getElementById('txtAddr3').value = tmp[4]; 
     document.getElementById('txtPhone').value = tmp[5]; 
     document.getElementById('txtPhone2').value = tmp[6]; 
     document.getElementById('txtEmail').value = tmp[7]; 
     document.getElementById('txtWebpage').value = tmp[8]; 
     document.getElementById('txtUrl').value = tmp[9]; 
    } 
</script> 
</head> 
<body> 
    <div class="container">  
     <header class="clearfix">    
      <img src="logo.png"/> 
      <nav class="codrops-demos"> 
      <a class="current-demo" href="index.php">Some text</a> 
      </nav>     
     </header> 
     <section class="main clearfix"> 
      <div class="fleft"> 
       <p>Da bi porucili vizit karte, izaberite ime i kolicinu, zatim potvrdite.</p> 
      </div> 
      <div class="fleft"> 
      <form id="testconfirmJQ" name="testconfirmJQ" method="post" action="output.php"> 
<script type="text/javascript">Setup();</script> 
    <table border="0"> 
     <input type="text" hidden="hidden" id="txtName" name="txtName" size="30" value=""> </td></tr> 
     <input type="text" hidden="hidden" id="txtAddr1" name="txtAddr1" size="30" value=""> </td></tr> 
     <input type="text" hidden="hidden" id="txtAddr2" name="txtAddr2" size="30" value=""></td></tr> 
     <input type="text" hidden="hidden" id="txtAddr3" name="txtAddr3" size="30" value=""> </td></tr> 
     <input type="text" hidden="hidden" id="txtPhone" name="txtAddr3" size="30" value=""> </td></tr> 
     <input type="text" hidden="hidden" id="txtPhone2" name="txtPhone2" size="30" value=""></td></tr> 
     <input type="text" hidden="hidden" id="txtEmail" name="txtEmail" size="30" value=""> </td></tr> 
     <input type="text" hidden="hidden" id="txtUrl" name="txtUrl" size="30" value=""></td> </tr> 
    <tr><td>How much?:</td><td><input type="text" id="kolicina" name="kolicina" size="5" value=""></td></tr> 
    <tr><td><input id="submitJQ" name="submitJQ" type="submit" class="styled-button-1" value="Confirm" /></td></tr> 
    </table> 
</form>

來源

2013-05-09 Vladimir Cvejic

你能不能至少正確縮進代碼??? – PeeHaa 2013-05-09 12:42:42

'（var i = 1; i <8; i ++）'因爲這個...... – RaphaelDDL 2013-05-09 12:43:43

你可以製作一個http://jsfiddle.net/，因爲它不起作用嗎？順便說一下你的html無效。 – slinky2000 2013-05-09 14:01:33

你限制在for循環（從i = 1到i < 8）的tmp大小。有幾個變化：

var StoreDetails = [ 
    ['A store','test1','test2','test3','test4','test5','test6','test7','test8','url'] 
    // Note: no comma 
]; 

function Setup() { 
    var str = "<select id='Store' class='styled-select' onchange='StoreInfo()'>"; 

    str += '<option disabled="disabled" selected="selected">Please Select</option>'; 

    for (var i=0; i<StoreDetails.length; i++) { 
     str += '<option value="'+StoreDetails[i].join('|')+'">'+StoreDetails[i] [0]+'</option>'; 
    } 

    str +='</select>'; 

    document.write(str); 
} 

function StoreInfo() { 
    var sel = document.getElementById('Store').value; 

    var values = sel.split("|"); 

    document.getElementById('txtName').value = values[1]; 
    document.getElementById('txtAddr1').value = values[2]; 
    document.getElementById('txtAddr2').value = values[3]; 
    document.getElementById('txtAddr3').value = values[4]; 
    document.getElementById('txtPhone').value = values[5]; 
    document.getElementById('txtPhone2').value = values[6]; 
    document.getElementById('txtEmail').value = values[7]; 
    document.getElementById('txtWebpage').value = values[8]; 
    document.getElementById('txtUrl').value = values[9]; 
} 

Setup();

...和形式：

<form> 
    <input id="txtName" /> 
    <input id="txtAddr1" /> 
    <input id="txtAddr2" /> 
    <input id="txtAddr3" /> 
    <input id="txtPhone" /> 
    <input id="txtPhone2" /> 
    <input id="txtEmail" /> 
    <input id="txtWebpage" /> 
    <input id="txtUrl" /> 
</form>

此代碼is working in my environment。

來源

2013-05-09 12:44:41 jterry

我試圖將該值增加到9或10，但實際上並沒有發生... – 2013-05-09 13:12:19

更新後的代碼正在爲我工作 - 我認爲問題的一部分是，StoreDetails字符串中只有8個變量訂單項的名稱:) – jterry 2013-05-09 13:50:42

Joe Terry，你介意分享表單嗎？由於某種原因，它仍然不適合我，我已經嘗試了一切。謝謝。 – 2013-05-09 13:57:09

8日VAR

document.getElementById('txtWebpage').value = values[8];

但沒有所謂的「txtWebpage」元素使的時候它獲取到：

document.getElementById('txtUrl').value = values[9];

這是不確定的。

而且不是使用值8來算與我會用：

StoreDetails[sel].length

來源

2013-05-09 14:15:04 slinky2000

只是一個關於這個問題的問題，也可能有人幫助。我試圖改變div的內容（我有一個模式彈出，它有背景圖像，我希望它改變每個選擇的下拉列表），是否有可能以某種方式與我使用這個腳本？再次感謝提前。 – 2013-05-09 14:19:38

不相關，但內部的變化功能把這樣的東西document.getElementById（'modalId'）。className =「newBackgroundImageCssClass」 – slinky2000 2013-05-09 14:27:21

你介意幫助我嗎？我已經解決了這個問題，我應該開一個新的討論還是...？我正在努力學習，謝謝！:) – 2013-05-09 14:34:26

javascript中的變量，自動填充表格

回答

相關問題