Question

我希望从10开始的数字显示在文本框中，每次单击按钮时，数字会减少1.如何在Javascript上执行此操作？

Answer 1

将文字字段定义为：

<input type="text" name="counter" id="countField" value="10"/>

然后将decreaseValue函数定义为：

function decreaseValue(){
    var fieldElem = document.getElementById("countField");
    fieldElem.value = parseInt(fieldElem.value, 10) -1;
}

将上述功能作为onclick功能添加到您的按钮，它应该全部完成。

Answer 2

好吧，首先要制作一个文本框和一个按钮：

<input id="mybox" type="text" value="10" />
<button id="mybutton">Decrease</button>

接下来，您需要一个单击处理程序来减少文本框中的值：

document.getElementById('mybutton').addEventListener("click", function(){
    var input = document.getElementById('mybox');
    mybox.value = parseInt(mybox.value, 10) - 1;
});

Answer 3

如果你有jquery，那很简单......

<script type='text/javascript'>
var totalClicks = 10;
$(document).ready(function() {
    $('INSERT THE ID OF THE BUTTON HERE').click(function() {
        totalClicks -= 1;
        $('INSERT THE NAME OF THE INPUT FIELD YOU WANT THE CONTENT HERE').val(totalClicks);
    });
});
</script>

Answer 4

演示：http://jsfiddle.net/6kVD9/

document.getElementById('btn').onclick = function() {
  var input = document.getElementById('input');
  input.value = parseInt(input.value) - 1;
};

注意：它不是crossbrowser，使用jQuery或类似的库来使用dom。

Answer 5

好吧，既然你指定了JavaScript，我就不会提到HTML5号输入.... ooops。 ;）

Anywho，JavaScript：

function counter(id){
input = document.getElemenyById(id); // the id of the element with the decreasing value

input.value = input.value - 1; //or input.value-- I guess
}

在HTML中：

<input type="text" id="id" value="10" /><!-- Field containing the value that is changed -->
<input type="button" name="counter" onclick="counter('id');" value="Clicky!" /> <!-- Button that changes the value when clicked -->

简单点击计数器

5 个答案: