时间戳

首页 > 解决方案 > 如何在 switch 语句中传递按钮 ID 以执行该按钮应该执行的任何功能？

javascript - 如何在 switch 语句中传递按钮 ID 以执行该按钮应该执行的任何功能？

问题描述

这是一个使用 HTML 和 Javascript 的简单计算器，我应该在按下相关按钮后使用 switch 语句来选择要执行的数学运算。我不知道我应该在开关内传递什么。这是我的代码。

<html>
<head>
<style>
p{
color:white;
 background-color:black;
 } 
 </style>
<script>
function simple_calculator(){
 var numl=0;
 var num2=0;
 var result=0;
  num1 = document.getElementById("no1").value;
 num2 = document.getElementById("no2").value;
 num1 = parseInt(document.getElementById("no2").value);
  num1 = parseInt(document.getElementById("no2").value); 

 switch(op) {
    case 1:
        result = num1 + num2;
        break;
    case 2:             
        result = num1 - num2;
        break;
    case 3:
        result = num1 * num2;
        break;
    case 4:
        result = num1 / num2;
        break;





 document.getElementById("result").innerHTML = result;

 default:
 }

 }
 </script>
 </head>
 <body>
    <h3>*- - - Simple Calculator - --*</h3>
<textarea id = "no1"> </textarea>
<textarea id = "no2"> </textarea>
 <button id="add" onclick="simple_calculator(1);">Add</button>
<button id="sub" onclick="simple_calculator(2);"> Subsract</button>
 <button id="mul" onclick="simple_calculator(3);">Multiply</button>
 <button id="div" onclick="simple_calculator(4);">Divide</button>

<p id="result"></p>

 </body>
 </html>

标签： javascripthtmlswitch-statement

解决方案

您需要使用onclick="simple_calculator(this.id)"where this is 元素的 id，并使用 id 进行开关

function simple_calculator(id) {
 
  var num1 = 0;
  var num2 = 0;
  var result = 0;

  num1 = parseInt(no1.value) || 0;
  num2 = parseInt(no2.value) || 0;
  
 
    switch (id) {
      case "add":
        result = num1 + num2;
        break;
      case "sub":
        result = num1 - num2;
        break;
      case "mul":
        result = num1 * num2;
        break;
      case "div":
        result = num1 / num2;
        break;
    }
    document.getElementById("result").innerHTML = result;
  }
<h3>*- - - Simple Calculator - --*</h3>
<textarea id = "no1" > </textarea>
<textarea id = "no2"> </textarea>
 <button id="add" onclick="simple_calculator(this.id)">Add</button>
 <button id="sub" onclick="simple_calculator(this.id)">Subsract</button>
 <button id="mul" onclick="simple_calculator(this.id)">Multiply</button>
 <button id="div" onclick="simple_calculator(this.id)">Divide</button>

<p id="result"></p>

推荐阅读