老师麻烦看下代码遇到个问题我写在代码注释里面了

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <input type='text' id='num1' /> <select id='operate'> <option value='+'>+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type='text' id='num2' /> <input type='button' value=' = ' id="btn" /> <input type='text' id='result' /> <script> //先取到每个节点 var num1 = document.getElementById('num1'); var select_s = document.getElementById('operate'); var num2 = document.getElementById('num2'); var btn = document.getElementById('btn'); var result = document.getElementById('result'); //定义了一个盒子sum来装计算结果 var sum = 0; //监听事件来决定进行什么运算然后把结果装进sum select_s.onclick = function () { var ysf = select_s.value; switch (ysf) { case '+': sum = Number(num1.value) + Number(num2.value); console.log(sum); break; case '-': sum = num1.value - num2.value; break; case '*': sum = num1.value * num2.value; break; case '/': sum = num1.value / num2.value; break; default: break; } }<br

>        //但是不知道为什么这sum值并没有变化，我是定义的全局变量sum啊，，，老师求解<

br> console.log(sum); btn.onclick = function () { result.innerHTML = sum; } </script> </body> </html> 

咸鱼王派大星 2021-04-01

源自：DOM 4-14 项目作业

收起

2回答

好帮手慕言 2021-04-01 15:48:33

同学你好，解答如下：

1、事件只有触发时才会执行，sum是在点击+-*/时才会重新赋值，在打印sum值的时候，点击事件还未触发，所以打印的sum值是初始值，也就是0。

2、给表单赋值，需要使用value属性，因此修改如下：

3、两个输入框中都输入内容，例如数字5，点击等号，得到的结果是0，很显然，结果是不对的。

这是因为在同学提供的代码中，只有点击+-*/时才会对sum重新赋值，点击等号不会改变sum的值，建议：点击等号就可以得出结果，修改如下：

去掉如下代码（如果不去掉的话，按钮的第二个点击事件会覆盖第一个点击事件）：

祝学习愉快~

收起回答

qq_口天吴_0 2021-04-01 12:24:35

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <input type='text' id='num1' /> <select id='operate'> <option value='+'>+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type='text' id='num2' /> <input type='button' value=' = ' id="btn" /> <input type='text' id='result' /> <script> //先取到每个节点 var num1 = document.getElementById('num1'); var select_s = document.getElementById('operate'); var num2 = document.getElementById('num2'); var btn = document.getElementById('btn'); var result = document.getElementById('result'); //定义了一个盒子sum来装计算结果 var sum = 0; //监听事件来决定进行什么运算然后把结果装进sum // 监听 "=" 按钮 btn 而不是监听选择按钮 + - * / // select_s.onclick = function () { btn.onclick = function () { var ysf = select_s.value; switch (ysf) { case '+':<br

>                    sum = Number(num1.value) + Number(num2.value);                   <

br> console.log(sum); break; case '-': sum = num1.value - num2.value; break; case '*': sum = num1.value * num2.value; break; case '/': sum = num1.value / num2.value; break; default: break; } //代码要移动到这里 result.value = sum; }<br

>        //但是不知道为什么这sum值并没有变化，我是定义的全局变量sum啊，，，老师求解<

br> console.log(sum); // btn.onclick = function () { // // result.innerHTML = sum; // // 计算结果sum 是要变成 result的值(value).而不是变成代码<br

>        //     // 而且要在一次监听里面完成计算,  如果分开代码应该是覆盖了,重写了.<

br> // result.value = sum; // } </script> </body> </html> 

首先,我也是自学的,不是老师.解释不一定正确.但是代码已经实现功能了.

其次你这个代码的逻辑也太乱了,我记得回答里面还是笔记里面有一个标准答案,我也是参考那个的.我一开始写的稍微比较乱,但没你这么乱.我记得我有发布在笔记里面

收起回答

提问者咸鱼王派大星 #1

怎么写对我知道，只是想不通我定义的全局变量sum,经过了第一个onclick事件后在外面控制台打印sum还是为零。

2021-04-01 14:23:25
qq_口天吴_0 回复提问者咸鱼王派大星 #2

你监听的是 + - * / 的按钮啊
1
select_s.onclick 
你要是选择点击select_s的按钮,控制台就会出现sum值啊.
你是不是点错了.
我在代码中也备注了

2021-04-01 14:47:08
提问者咸鱼王派大星回复 qq_口天吴_0 #3

你还没懂我意思我的源代码是监听+ - * / 当我点了这其中一个就吧前后两个数字进行计算然后赋值给sum,我现在的疑问是为什么全局变量sum没有发生变化

2021-04-01 15:20:41