Javascript表單更新Onclick

我正在製作一個html表單，允許用戶提交數字。與其讓用戶輸入數字，我只是希望他們能夠單擊按鈕來增加或減少文本輸入中的數字。下面的代碼的重要棋子沒有這個究竟如何我想：Javascript表單更新Onclick

的Javascript：

<script type="text/javascript"> 
    function increase (form) { 
     var val = form.h1.value; 
     val++; 
     form.h1.value = val; 
     } 

    function decrease (form) { 
     var val = form.h1.value; 
     val--; 
     form.h1.value = val; 
     } 
</script>

HTML

<input type="textbox" name="h1" size="3"> 
<input type="button" onclick="increase(this.form)" value="+"> 
<input type="button" onclick="decrease(this.form)" value="-">

我的問題是，我希望能夠用任何其他文本框（如h2，h3等）的「增加」和「減少」功能。我試圖通過添加第二個參數id來更改代碼，並使用它來確定要更新哪個表單元素。它不會工作。任何幫助找出我出錯的地方將不勝感激！

的Javascript

<script type="text/javascript"> 
    function increase (form, id) { 
     var val = form.id.value; 
     val++; 
     form.id.value = val; 
     } 

    function decrease (form, id) { 
     var val = form.id.value; 
     val--; 
     form.id.value = val; 
     } 
</script>

HTML

<input type="textbox" name="h1" size="3"> 
<input type="button" onclick="increase(this.form, h1)" value="+"> 
<input type="button" onclick="decrease(this.form, h1)" value="-">

來源

2011-10-08 WX Fox

h2，h3等不是其他的文本框，所以我不完全確定你的意思。 –

你正在對'string'變量進行遞增和遞減，這是非常脆弱的。無論如何，只需使用元素引用，而不需要代碼中的表單引用。 –

嘗試

function increase (form, id) { 
    var val = form[id].value; 
    val++; 
    form[id].value = val; 
}

和

<input type="button" onclick="increase(this.form, 'h1')" value="+"> 
<input type="button" onclick="decrease(this.form, 'h1')" value="-">

表單作爲一個字典，您可以通過名稱來處理其字段。您可以通過使用方括號來完成此操作。該字段的名稱是一個字符串，所以這就是爲什麼您必須通過'h1'而不是僅僅h1。

來源

2011-10-08 03:16:58

嘗試進行以下更改：

在您的表單中傳遞ID而不是變量的字符串。

<input type="textbox" name="h1" size="3"> 
<input type="button" onclick="increase(this.form, 'h1')" value="+"> 
<input type="button" onclick="decrease(this.form, 'h1')" value="-">

而在你的JavaScript中，改變你引用字段int的方式。

<script type="text/javascript"> 
    function increase (form, id) { 
     var val = form[id].value; 
     val++; 
     form.id.value = val; 
    } 

    function decrease (form, id) { 
     var val = form[id].value; 
     val--; 
     form.id.value = val; 
    } 
</script>

來源

2011-10-08 03:23:46

而不是傳遞兩個參數，您可以直接傳遞其值需要更改的文本框元素。嘗試下面的更改。

<input type="textbox" name="h1" size="3"> 
<input type="button" onclick="increase(document.h1)" value="+"> 
<input type="button" onclick="decrease(document.h1)" value="-">

而你的javascript函數將如下所示。

<script type="text/javascript"> 
function increase (element) { 
    element.value = element.value++; 
} 

function decrease (element) { 
    element.value = element.value--; 
} 
</script>

來源

2011-10-08 04:01:38 asandeep

Javascript表單更新Onclick

回答

相關問題