作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我一直在尝试弄清楚如何制作它,以便如果选中特定复选框,则在提交表单之前单击提交按钮时,文本框中的总金额将添加到其中 50.00。事实上,最好在选中该复选框后立即进行更新。
这是我迄今为止尝试过的:
<!DOCTYPE html>
<html>
<head>
<script>
function toggle(){
var indoorCamping = 50.00;
var total = 0.00;
if(document.getElementByName('fifty').is(':checked')){
total = (indoorCamping + document.getElementsByName('Amount').value);
document.getElementsByName('Amount').value = total;
}
else{
return;
}
}
</script>
</head>
<body>
<p>Click the button to trigger a function.</p>
<input type="checkbox" name="fifty" value="indoor"/>
<label for="Amount">Amount <span class="req">*</span> <span
id="constraint-300-label"></span></label><br />
<input type="text" class="cat_textbox" id="Amount" name="Amount" />
<p id="demo"></p>
<button onclick="toggle()">Click me</button>
</body>
</html>
最佳答案
文本输入的值最初始终是文本(字符串)。在添加该值之前需要显式转换为数字,否则它会连接文本。因此“20”将变成“5020”。
借用mohkhan的代码:
<script>
function toggle(checkbox){
var indoorCamping = 50.00;
var total = 0.00;
if(checkbox.checked){
total = (indoorCamping + document.getElementById('Amount').value * 1);
document.getElementById('Amount').value = total;
}
}
</script>
我乘以 1,这是将“20”转换为数字的一种方法。 Number(x)
、parseInt(x)
和 parseFloat(x)
是其他方法。
不过,我更愿意使用对象变量,amt
:
<script>
function toggle(checkbox) {
var indoorCamping = 50.00;
var total = 0.00;
var amt = null;
if (checkbox.checked) {
amt = document.getElementById('Amount');
total = (indoorCamping + amt.value * 1);
amt.value = total;
}
}
</script>
关于javascript - 仅当选中复选框时,如何将 #.## 值添加到其中已有另一个 ##.## 值的文本框中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17903851/
我是一名优秀的程序员,十分优秀!