使用 Javascript,我如何比较 2 个值以查看它们是否可以被彼此整除?

Using Javascript, how do I compare 2 values to see if they are divisible by each other?

我正在尝试在这里编写一个事件处理程序,以便当用户在第一个文本框和第二个文本框中输入数字并单击 "Compare Values" 按钮时,将执行一个函数并检查

如果其中一个数字为零,则在 "box5"、"You have entered zero"

上打印出来

如果两个数字相同,则在"box5"、"The numbers are the same"

上打印出来

如果第一个数可以被第二个数整除,则在 "box5"、"The first is divisible by the second"

上打印出来

如果第二个数能被第一个数整除,则在 "box5"、"The second is divisible by the first"

上打印出来

else-如果数字不能相互分割,则在"box5"、"They are not divisible"

上打印出来

我已经为此创建了 HTML 页面,但我不知道该如何处理。一些用户告诉我使用 "keyup" 方法,我希望有人可以向我展示他们将如何使用 "keyup" 方法来解决这个问题的示例(如果可能的话)。提前致谢

<p> Enter two numbers and we will tell you if they are evenly divisble
<p> Enter your first number:</p> <input type="text" id="box3">
<p> Enter your second number: </p> <input type="text" id="box4"> 
<button id="compareValue">Compare Values</button>
<p> Output will appear here: </p> <input text="type" id="box5" disabled>

我只是想创建一个简单的工具来比较用户输入的 2 个数字,并检查它们是否可以整除,如果可以,哪个数字可以被哪个数字整除,并确保输入中没有输入零,否则-如果没有东西可以被彼此整除,那么它告诉你它们是不可整除的。

编辑:我忘记包括我的 JavaScript 尝试:

let firstNumber = document.getElementById("box3")
let secondNumber = document.getElementById("box4")
let outputNumber = document.getElementById("box5")

$(document).ready(function(){
$("compareValue").keyup(function(){
let a = firstNumber.value;
let b = secondNumber.value;
  if (a === 0 || b === 0);
    let outputNumber.value = "The Number is ZERO."
  });
  if (a % b );
    let outputNumber.value = "First number is divisible by the second number."
  });
  if (b % a);
    let outputNumber.value = "Second Number is divisble by the first number."
  });
  else-if (a !== b && b !== a);
    let outputNumber.value = "The numbers are not divisible."
  });
});

只需使用 %(模数)进行整除,使用 == 进行相等性测试:

function compare() {
  var value1 = parseInt(document.getElementById("box3").value);
  var value2 = parseInt(document.getElementById("box4").value);
  var display = document.getElementById("box5");
  if (value1 == 0 || value2 == 0) {
    display.value = "You have entered zero";
  } else if (value1 == value2) {
    display.value = "The numbers are the same";
  } else if (value1 % value2 == 0) {
    display.value = "The first is divisible by the second";
  } else if (value2 % value1 == 0) {
    display.value = "The second is divisible by the first";
  } else {
    display.value = "They are not divisible";
  }
}
<p> Enter two numbers and we will tell you if they are evenly divisble</p>
<p> Enter your first number:</p> <input type="text" id="box3">
<p> Enter your second number: </p> <input type="text" id="box4">
<button id="compareValue" onclick="compare()">Compare Values</button>
<p> Output will appear here: </p> <input text="type" id="box5" disabled>

听起来你对这整个 html/js 真的很陌生;如果我的解释非常非常明确,请原谅。

  1. 在 html 后添加一个 script 标签,例如<script> stuff here </script>

  2. 用一些javascript代码替换这里的东西。

要获取对元素的变量引用,请使用

var someElement = document.getElementById("#id_of_an_element")

获取或设置输入元素内数据的值:使用

inputElement.value

处理元素上的点击事件:使用

buttonElement.addEventListener("click", function(){
    //Do stuff!
})

你应该从那里开始。

祝你站起来好运!公平地说,这是对 Whosebug 的一个非常非常 n00b 级的查询,没有什么是按照 youtube 上的 30 分钟指南无法回答的,所以采取一些主动行动 - 它确实有帮助:)

既然你用 jquery 标记了它,我猜你会对 jQuery 解决方案持开放态度。

$(function() {
  function compare(a, b) {
    if (typeof a !== "number" || typeof b !== "number") {
      return false;
    }
    var result;
    switch (true) {
      case (a === 0 || b === 0):
        result = "You have entered zero";
        break;
      case (a === b):
        result = "The numbers are the same";
        break;
      case (a % b === 0):
        result = "The first is divisible by the second";
        break;
      case (b % a === 0):
        result = "The second is divisible by the first";
        break;
      default:
        result = "They are not divisible";
        break;
    }
    return result;
  }
  $("#compareValue").click(function(e) {
    var v1 = parseInt($("#box3").val());
    var v2 = parseInt($("#box4").val());
    $("#box5").val(compare(v1, v2));
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p> Enter two numbers and we will tell you if they are evenly divisble
  <p> Enter your first number:</p> <input type="text" id="box3">
  <p> Enter your second number: </p> <input type="text" id="box4">
  <button id="compareValue">Compare Values</button>
  <p> Output will appear here: </p> <input text="type" id="box5" disabled>

尽情享受吧!