javascript - javascript创建一个存储按钮来添加/删除数量和显示量( 非常基本)

  显示原文与译文双语对照的内容
123 1

在窗体内创建添加和减去按钮,以添加和删除一行股票的额定值。

类似于:

我是html新手,对javascript非常新。

function minus(){
 var bCount = parseInt(document.calculateCart.count.value);
 var count = bCount--;
 document.calculateCart.count.value = count;
 }
function minus(){
 var bCount = parseInt(document.calculateCart.count.value);
 var count = bCount++;
 document.calculateCart.bCount.value = count;
}
<div class="productForm">
 <form name="calculateCart" action="#">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <input type="int" name="count" value=0>
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
时间:原作者:0个回答

80 1

如果要使用按钮使用按钮并使用文本输入,可以以将代码更改为:

<div class="productForm">
 <form name="calculateCart" action="https://titan.csit.rmit.edu.au/~e54061/wp/processing.php">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <input type="number" name="count" value=0>
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
<script>
 function minus(){
 document.calculateCart.count.value = --document.calculateCart.count.value;
 }
 function add(){
 document.calculateCart.count.value = ++document.calculateCart.count.value;
 }
</script>

在HTML中不存在输入类型- int,你需要使用数字或者文本。

如果只需要使用按钮更改值,则可以将它的设置为:

<div class="productForm">
 <form name="calculateCart" action="https://titan.csit.rmit.edu.au/~e54061/wp/processing.php">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <span id="your-number">1</span>
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
<script>
 var a = 0;
 function minus(){
 a -= 1;
 document.getElementById('your-number').innerHTML = a;
 }
 function add(){
 a += 1;
 document.getElementById('your-number').innerHTML = a;
 }
</script>
原作者:
129 4
function minus(){
 var oldVal = parseInt(document.getElementById("myVal").value);
 if(oldVal> 0){
 oldVal--;
 }
 document.getElementById("myVal").value = oldVal;
 }
function add(){
 var oldVal = parseInt(document.getElementById("myVal").value); 
 oldVal++;
 document.getElementById("myVal").value = oldVal;
}
<div class="productForm">
 <form name="calculateCart" action="https://titan.csit.rmit.edu.au/~e54061/wp/processing.php">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <input type="text" id="myVal" name="count" value="0">
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
原作者:
64 5
  • 你的代码中出现了一个错误:你的添加操作的函数称为 minus() 。所以你有两个同名的函数
  • 我相信你是以错误的方式得到计数的。你应该为输入分配一个id并使用 getElementById

工作代码:

function minus(){
 var bCount = document.getElementById('count').value;
 bCount--;
 document.getElementById('count').value = bCount;
 document.getElementById('count');
 }
 function add(){
 var bCount = document.getElementById('count').value;
 bCount++;
 document.getElementById('count').value = bCount;
 document.getElementById('count');
 }
<div class="productForm">
 <form name="calculateCart" action="https://titan.csit.rmit.edu.au/~e54061/wp/processing.php">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <input type="int" name="count" id="count" value=0>
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
原作者:
136 1

你需要使用 document.getElementById 来获取旧的文本框值。

请检查 below 代码:

function minus(){
 var oldVal = parseInt(document.getElementById("myVal").value); 
 oldVal--;
 document.getElementById("myVal").value = oldVal;
 }
function add(){
 var oldVal = parseInt(document.getElementById("myVal").value); 
 oldVal++;
 document.getElementById("myVal").value = oldVal;
}
<div class="productForm">
 <form name="calculateCart" action="https://titan.csit.rmit.edu.au/~e54061/wp/processing.php">
 <div class="+-Buttons">
 Quantity <br>
 <input type="button" value="-" onClick="minus()">
 <input type="text" id="myVal" name="count" value="0">
 <input type="button" value="+" onClick="add()">
 </div>
 </form>
</div>
原作者:
59 5
  • 你有两个函数 minus,其中一个必须是 add

如果要使用 attributre name 进行选择,则需要使用如下所示的内容:

document.getElementsByName("count") [0] 。tagname

原作者:
...