- 微信
- 微博
  
  分享文章到微博
- 复制链接
  
  复制链接到剪贴板

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

红目香薰发表于 2022/11/29 15:27:48 2022/11/29

【摘要】 JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）一、语言和环境1. 实现语言：JavaScript。2. 开发环境：VScode。二、要求1、在文本框中输入两个操作数和选择运算符后，在页面上显示输出结果。参考图如下所示：编辑三、推荐实现步骤（1）单击“计算”按钮后，删除两个文本框左右两边的空格，删除空格后，判断输入框中是否都输入了内容，只要其中一个文本框...

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

一、语言和环境

1. 实现语言：JavaScript。

2. 开发环境：VScode。

二、要求

1、在文本框中输入两个操作数和选择运算符后，在页面上显示输出结果。

参考图如下所示：

编辑

三、推荐实现步骤

（1）单击“计算”按钮后，删除两个文本框左右两边的空格，删除空格后，判断输入框中是否都输入了内容，只要其中一个文本框没有输入，则提示“请输入两个操作数”。

（2）在输入了数据的前提下，验证输入的是否都是数值，只要其中一个输入错误，则提示“请输入正确的数值”。

（3）单击“计算”按钮，在判断输入的数据格式都是正确的前提下，根据用户选择的运算符号（可以选择 +、-、*、/）计算结果，并把结果显示在最后一个文本框中。

四、注意事项

1. 仔细审题，准确理解题目要求。

2. 注意按照要求来进行设计。

3. 代码的书写、命名须符合规范，添加适当的注释。

五、评分标准

题目：文件操作
该程序评分标准如下：
100	四则运算界面
	10	Html网页创建成功
	10	文本输入框、按钮添加成功
	10	“计算”按钮单击事件绑定函数成功
	10	文本框输入内容正确进行非空判断
	10	文本框输入内容正确进行数值判断
	10	点击运算按钮后，“+”运算结果准确
	10	点击运算按钮后，“-”运算结果准确
	10	点击运算按钮后，“*”运算结果准确
	10	点击运算按钮后，“/”运算结果准确
	10	变量命名规范，有注释
总分		100分

实现代码：

<!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>jsWeekTest</title>
</head>

<body>
    <script>
        // result_calc
        function calc() {
            var x = document.getElementById("x").value;
            var opt = document.getElementById("opt").value;
            var y = document.getElementById("y").value;
            if (x == "" || y == "") {
                alert("con't null");
                return;
            }
            result = x + opt + y;
            // result_info
            document.getElementById("result").value = eval(result);
        }
    </script>
    <input type="text" id="x" />
    <select id="opt">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type="text" id="y" /><span>=</span>
    <input type="text" id="result">
    <button onclick="calc()">计算</button>
</body>

</html>

点赞
收藏
关注作者

0/1000

抱歉，系统识别当前为高风险访问，暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称，即可参与社区互动！

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

确认取消

加入云驻计划，成为创作者

华为云周边好礼
免费体验产品
特殊身份标识
线下官方门票
内部专家零距离
与10000+优质创作者共同成长

立即加入

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

全部回复

设置昵称

关于作者

目录

加入云驻计划，成为创作者

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

JavaScript——周技能检测——菜单编辑——2022年11月22日（考完）

全部回复

设置昵称

关于作者

目录

加入云驻计划，成为创作者

推荐阅读

相关产品