在输入字段中放入乘法或除法，以对其他2个输入字段执行乘法或除法

put in multiply or divide in input field to perform either multiply or divide on the other 2 input fields

本文关键字：除法 字段 输入 其他 2个 执行      更新时间：2023-09-26

嘿，伙计们，我正试图创建一个包含3个参数的函数。第一个参数应该是输入字段中的"MULTIPLY"或"DIVIDE"，然后后面跟着两个数字，这两个数字也在单独的输入字段中，应该根据第一个参数进行多路复用或除法。我不知道该如何用代码写下来。

到目前为止，这是我的代码；

<!DOCTYPE html>
<html>
<head>
<script src="ovning3-3.js"></script>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
<h1></h1>
<p>
</p>

<input id="first" type="text">
<input id="second" type="text">
<input id="third" type="text">
<input type="button" value="Multiply" onclick="multiply()">
<input type="button" value="Divide" onclick="divide()">
<input type="button" value="Multiply and Divide" onclick="multiplyAndDivide()">
</body>
</html>

以及java脚本；

function multiply() {
    var x = document.getElementById("first").value;
    var y = document.getElementById("second").value;
    var z = document.getElementById("third").value;
    var result = (x * y) * z
    alert(result)
}
function divide() {
    var x = document.getElementById("first").value;
    var y = document.getElementById("second").value;
    var z = document.getElementById("third").value;
    var result = (x / y) / z
    alert(result)
}

function multiplyAndDivide() {
    multiply();
    divide();
}

有人帮忙吗？

您只能使用一个函数

function multiplyOrDivide(todo){
var x = document.getElementById("first").value;
var y = document.getElementById("second").value;
var z = document.getElementById("third").value;
if(todo==0){
    alert(Number(x*y*z));
}
else{
    if(y!=0 || z!=0){
        alert(Number(x/y)/z);
    }
 }

}

在onclick中，您可以将选项传递为multiplyOrDivide（1）

看看这是否是您想要的

<!DOCTYPE html>
<html>
<head>
<script>
    function calculate() {
        var x = document.getElementById("first").value;
        var y = document.getElementById("second").value;
        var d = document.getElementById("decision").value;
        if (d=="*")
           result = x*y;
        else if(d=="/")
           result = x/y;
        alert(result)}
</script>
  <title></title>
</head>
<body>
<h1></h1>
<select id="decision">
    <option value="*">Multiply</option>
    <option value="/">Divide</option>
</select><br>
<input id="first" type="text">
<input id="second" type="text"><br>
<input type="button" value="Calculate" onclick="calculate()">
</body>
</html>

如果您需要任何进一步的解释，请告诉我

您可以使用选择菜单来选择要执行的操作。要使用js功能，您可以查看以下内容：

function calculate() {
  var selected_operation = document.getElementById("operation");
  var operation = selected_operation.options[selected_operation.selectedIndex].value;
  if (operation == 'multiply') 
     multiply(operation);
  else if (operation == 'divide') 
     divide();
  else if (operation == 'mulitiply_division')
     multiplyAndDivide();
}
function multiply() {
  var x = document.getElementById("first").value;
  var y = document.getElementById("second").value;
  var z = document.getElementById("third").value;
  var result = (x * y) * z
  alert(result);
}
function divide() {
  var x = document.getElementById("first").value;
  var y = document.getElementById("second").value;
  var z = document.getElementById("third").value;
  var result = (x / y) / z
  alert(result);
}
function multiplyAndDivide() {
  multiply();
  divide();
}

要查看整个场景，请访问DEMO

function mul()
{
	var a = document.getElementById("v1").value;
	var b = document.getElementById("v2").value;
	
	document.getElementById("answers").innerHTML = "Multiplication is: " + a * b;
}
function div()
{
	var a = document.getElementById("v1").value;
	var b = document.getElementById("v2").value;
	
	document.getElementById("answers").innerHTML = "Division is: " + a / b;
}
<!DOCTYPE html>
<html>
<head>
</head>
<style>
body{
padding-left: 80px;
}
</style>
<body>
<p id="answers"></p>
<input type="text" placeholder="Value 1" id="v1"><br><br>
<input type="text" placeholder="Value 2" id="v2"><br><br>
<input type="button" onclick="mul()" id="mul" value="Multiplication">
<input type="button" id="div" onclick="div()" value="Division">
</body>
</html>

说明：document.getElementById（id）.value:value属性设置或返回文本字段的value属性的值。

document.getElementById（"result"）.innerHTM:innerHTML属性设置或返回元素的HTML内容（内部HTML）。

相关文章：