两个复选框绑定两个输入的数,选中两个复选框就展示他们相加的结果
时间: 2024-03-09 07:49:25 浏览: 17
好的,这个问题可以通过以下步骤来解决:
1. 在 HTML 中创建两个复选框和两个输入框,分别用于输入两个数并选择是否相加。
```html
<input type="checkbox" id="checkbox1">
<input type="text" id="number1">
<input type="checkbox" id="checkbox2">
<input type="text" id="number2">
```
2. 在 JavaScript 中获取复选框和输入框的值,并绑定复选框的点击事件。
```javascript
const checkbox1 = document.getElementById("checkbox1");
const checkbox2 = document.getElementById("checkbox2");
const number1 = document.getElementById("number1");
const number2 = document.getElementById("number2");
checkbox1.addEventListener("click", calculate);
checkbox2.addEventListener("click", calculate);
function calculate() {
if (checkbox1.checked && checkbox2.checked) {
const result = Number(number1.value) + Number(number2.value);
console.log(result); // 在控制台中输出相加的结果
}
}
```
3. 在 calculate 函数中判断两个复选框是否都选中,如果是,则将两个输入框中的数相加并输出结果。
这样,当用户选择两个复选框并输入两个数时,就会自动展示它们相加的结果。