-1

我有一个带有 PLUS + 按钮的文本字段来增加文本字段的值，同时我想要（0 - 100）的限制。我不希望任何一个增加值超过 100 或小于 0。

我尝试以下仅适用于添加功能的代码

<script type="text/javascript">
function add(){
document.getElementById("name").value++;
}
function limit(){
document.getElementById('name').value;
      if(this.value > 200){
           this.value = 200;
      }
      if(this.value < 10){
           this.value = 10;
      }
}
</script>

<form name="quiz" >
<input type='text' name='name' id='name'/>
<input type='button' name='plus' onclick="add();limit();" value='+'/>
</form>

是否可以将值增加 5 即而不是 value++ 我们可以使用 value+5 吗（我尝试过但不工作）

4

6 回答 6

1

您可以简单地将代码更改为仅调用一个函数（组合add()and limit()），如下所示：

<script type="text/javascript">
    function add() {
        var name = document.getElementById("name"); // Get the input (store in local var).
        var value = parseInt(name.value) + 5; // Store the new value locally.

         if(value > 100){
              value = 100;
         }
         else if(value < 10){
              value = 10;
         }

         name.value = value; // Set the new value.
    }
</script>

然后只需调用add()：

<input type='text' name='name' id='name' value="0"/>
<input type='button' name='plus' onclick="add();" value='+'/>

此外，您可以使其更具动态性并发送要作为参数添加的值：

function add(numberToAdd) {
    var name = document.getElementById("name");
    var value = parseInt(name.value) + numberToAdd; // Use the parameter
    ....

然后这样称呼它：

<input type='button' name='plus' onclick="add(5);" value='+'/>

这样您就可以拥有更多具有不同值的按钮：

<input type='button' name='plus1' onclick="add(1);" value='+1'/> <!-- Will add +1 -->
<input type='button' name='plus2' onclick="add(2);" value='+2'/> <!-- Will add +2 -->
<input type='button' name='plus3' onclick="add(3);" value='+3'/> <!-- Will add +3 -->
于 2012-11-27T08:23:10.213 回答
1 
    function add(){
x=document.getElementById("name").value;
x=Number(x);
x=x+5
document.getElementById("name").value=x;
}

    function limit(){
x=document.getElementById("name").value;
x=Number(x);
      if(x > 100){
           document.getElementById("name").value = 100;
      }
      if(x < 50){
           document.getElementById("name").value = 0;
      }
于 2012-11-27T08:23:17.437 回答
1

如果您现在调用 add 函数，它会将您的值增加 5 仅当您的当前值低于 200 且超过 10 时才会这样做

function add() {
    var val = document.getElementById("name").value;
    if(val < 200 && val > 10) {
        document.getElementById("name").value += 5;
    }
}

有了这个解决方案，就不需要第二个功能（例如限制）

于 2012-11-27T08:23:58.950 回答
0 
function add(howMuch){
  document.getElementById("name").value = document.getElementById("name").value+5;
}
于 2012-11-27T08:23:46.487 回答
0

简单地做这个

function add(){
document.getElementById("name").value++;
limit();
}

是的，您可以增加 5。只需这样做：

document.getElementById("name").value+=5;
于 2012-11-27T08:23:57.697 回答
0

你的情况的简单解决方案是只使用一个函数来完成你想要的一切......希望它会帮助你:)

function add() {
   var limit = document.getElementById("name").value();
   if (limit < 200 || limit > 0) {
     document.getElementById("name").value++;
     //or use this
     //document.getElementById("name").value = limit + 5;
   }
   else
     //anything here.
}
于 2012-11-27T08:26:04.757 回答