Question

我有，我要追加到形式的按鈕被點擊權當提交隱藏輸入標籤變量名和值。我如何去編碼它？

這裏是我的代碼：

<script type="text/javascript"> 

hname="reference"; 
hvalue="1"; 

function insertInput(){ 
document.write("<input type='hidden' name='" + hname + " ' value=' " + hvalue + " '/><br/>"); 
} 

</script> 


<form id="form1"> 
    <p><label>Username:</label> <input type="text" name="username" size="10"/></p> 
    <p><label>Password:</label> <input type="password" name="password" size="10"/></p> 

    <p id="hidden"><!-- Insert Hidden input tag here --></p> 

    <button type="submit' onClick="insertInput();">Log In</button> 
</form> 

我似乎無法得到它的工作。請幫忙！先謝謝了！

Answer 1

試試這個：

<form id="form1"> 
     <p><label>Username:</label> <input type="text" name="username" size="10" /></p> 
     <p><label>Password:</label> <input type="password" name="password" size="10" /></p> 

     <p id="hidden"><!-- Insert Hidden input tag here --></p> 

     <button type="submit" onclick="return insertInput();">Log In</button> 
</form> 



<script type="text/javascript"> 

    hname="reference"; 
    hvalue="1"; 

    function insertInput(){ 
     var para, hiddenInput, br; 
     para = document.getElementById('hidden'); 
     hiddenInput = document.createElement('input'); 
     hiddenInput.type = 'hidden'; 
     hiddenInput.name = hname; 
     hiddenInput.value = hvalue; 
     para.appendChild(hiddenInput); 
     br = document.createElement('br'); //Not sure why you needed this <br> tag but here it is 
     para.appendChild(br); 

     return false; //Have this function return true if you want to post right away after adding the hidden value, otherwise leave it to false 
    } 

</script> 

Answer 2

document.write()只有當文件被解析工作。只要文件處於就緒狀態（即DOMContentLoaded事件已被解僱），document.write隱含的調用document.open()，這反過來又重置您的文檔。

你想使用DOM方法如下：

var form = document.getElementById('form1'); 
form.addEventListener("submit", function() { 
    var input = document.createElement('input'); 
    input.type = 'hidden'; 
    input.name = 'reference'; 
    input.value = '1'; 
    this.appendChild(input); 
}, true); 

Answer 3

這是行不通的，因爲document.write只能同時加載頁面時，試圖加載頁面後使用它會失敗。

你可以用純DOM腳本做，但我會建議使用DOM庫像jQuery，他們提出做這樣的事情要容易得多。

這裏有一個方法，你可以用jQuery做到這一點：

<form id="form1"> 
    <p><label>Username:</label> <input type="text" name="username" size="10"/></p> 
    <p><label>Password:</label> <input type="password" name="password" size="10"/></p> 

    <button type="submit">Log In</button> 
</form> 

<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script> 
$(function() { 
    var hname = "reference", 
     hvalue = "1"; 

    $("#form1").on("submit", function() { 
     $(this).append("<input type='hidden' name='" + hname + " ' value=' " + hvalue + " '/><br/>"); 
    }); 
}); 

</script>