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

回答

相关问题