比较彼此一定百分比内的 3 个值
Compare 3 values within certain percentage of each other
我正在努力做到这一点：
- 3个输入框
- 获取输入值并与特定百分比进行比较
如果值彼此相差在 3% 以内。输出=东西
否则输出其他东西。
如有任何帮助，我们将不胜感激。
这是一个代码示例，您可以从中导出逻辑。
https://jsfiddle.net/1u4c0jzj/
<input type="text" id="value1" />
<input type="text" id="value2" />
<input type="text" id="value3" />
<button id="checkValues">Check</button>
<div id="output" />
document.getElementById("checkValues").onclick = function(){
var value1 = parseFloat(document.getElementById("value1").value);
var value2 = parseFloat(document.getElementById("value2").value);
var value3 = parseFloat(document.getElementById("value3").value);
var maxValue = parseFloat(Math.max(Math.max(value1, value2), value3));
if(1-(value1 / maxValue) <= .03 && 1-(value2 / maxValue) <= .03 && 1-(value3 / maxValue) <= .03){
alert('all numbers are within 3% of each other')
}
else{
alert('numbers NOT within 3%');
}
}
它接受 3 个输入，找到最大值并确保所有 3 个数字都在最大值的 3% 以内。
只需对值进行排序并计算 relative change:
function calculatePercent(a, b, c) {
var values = [a, b, c];
values.sort(function (a, b) { return a - b; });
return (values[2] - values[0]) / values[0];
}
document.write(calculatePercent(100, 101, 102) + '<br>');
document.write(calculatePercent(80, 90, 100) + '<br>');
首先创建基本如下所示的输入：
<input type="text" width="3em">
这将创建一个输入标签。因此，放置三个或任意多个将创建输入。现在，我们需要一种方法来获取我们刚刚创建的输入。为此，我们需要一些 JavaScript.
document.getElementsByTagName("input");
这将使我们在屏幕上看到所有输入标签。现在，我们可以遍历这些标签并获取我们需要的数据，我将把这些数据放入数组中。
注意：每个输入标签都有一个名为 属性 的值，它存储放置在输入内部的字符串，可以通过在前面放置 + 将其更改为数字。
var numbers = [],
inputs = document.getElementsByTagName("input");
for(var i = 0; i < inputs.length; ++i)
{
var number = +inputs[i].value;
// Makes sure that a number is there.
if(!isNaN(number))
numbers.push(number);
}
现在我们已经将所有内容都放在一个数组中，是时候进行一些数学运算了！
让我们看一个简单的例子，比较一个特定数字与另一个数字的百分比。如果给定 7 和 3，它们之间的距离有多远？首先我们找到平均值 -> (7 + 3) / 2 然后我们找到 |3 - 7| 之间的差异，然后我们将差异除以平均值... 4 / 5 = .8。耶！但是，三个数字呢？好吧，现在我们必须在每个数字之间这样做......然后我们检查每个数字以查看是否在范围内。呸！为此，它需要一个嵌入式 for 循环。
所以，我们需要有一个嵌入式 for 循环，这样我们就不会重复比较。就像下面这样：
numbers => 1 2 3 4
Compare 1 -> 2, 1 -> 3, 1 -> 4
Compare 2 -> 3, 2 -> 4
Compare 3 -> 4
Stop!
这让我陷入了困境：
var inrange = true,
tolerance = 3/*In percentage!*/;
for(var i = 0; i < numbers.length && inrange; ++i)
for(var j = i + 1; j < numbers.length && inrange; ++j)
{
var diff = (numbers[i] - numbers[j]),
// Need to make sure diff is positive. Could use Math.abs...
pdiff = 2 * (diff < 0 ? -1*diff : diff)
/ (numbers[i] + numbers[j]);
// If false will cause the loops to stop.
inrange = (100 * pdiff) <= tolerance;
}
有了计算功能，我们现在可以专注于显示了！
现在，我们需要一个可以调用函数并为我们施展魔法的按钮！这也可以通过输入标签来完成，但是要改变它的类型。
<input type="submit" value="calculate" onclick="calculate()">
所以，现在我们需要一种方法来显示...一个非常简单的方法是使用带有 id 的 <p> 标签。
<p id="display"></p>
为了得到这个标签，我们也可以使用一些JavaScript。
document.getElementById("display");
这些标签有一个名为 innerHTML 的属性，我们可以在其中进行编辑，嗯...，更改内部 HTML。
var p = document.getElementById("display");
p.innerHTML = "Hello World!";
现在，我们可以结合上面的所有内容得到：
<input type="text" width="3em">
<input type="text" width="3em">
<input type="text" width="3em">
<input type="submit" value="calculate" onclick="calculate()">
<p id="display"></p>
<p id="results"></p>
<script>
// The tolerance for the numbers to be within.
var tolerance = 3,
// The number of inputs expected.
amount = 3;
function calculate() {
var numbers = [],
inputs = document.getElementsByTagName("input");
// Gets all of the numbers.
for(var i = 0; i < inputs.length; ++i)
// Need to check type to make sure not getting the button.
if(inputs[i].type === "text"){
var number = +inputs[i].value;
if(!isNaN(number))
numbers.push(number);
}
// Need to make sure the correct amount of inputs were found.
if(numbers.length !== amount) return;
var inrange = true,
// Gets the results p tag.
results = document.getElementById("results");
// Clear old results.
results.innerHTML = "";
// Compares each number finding the avg percent difference.
for(var i = 0; i < numbers.length && inrange; ++i)
for(var j = i + 1; j < numbers.length && inrange; ++j) {
var diff = (numbers[i] - numbers[j]),
pdiff = 2 * (diff < 0 ? -1*diff : diff)
/ (numbers[i] + numbers[j]);
inrange = (100 * pdiff) <= tolerance;
results.innerHTML += "Input " + (i+1) + " to " + (j+1)
+ ": " + (100 * pdiff) + " " + (inrange ? "<=" : ">") + " " + tolerance
+ " <br>";
}
// Gets the display tag.
var p = document.getElementById("display");
// Makes sure that within tolerance!
if(inrange)
p.innerHTML = "Within tolerance!";
else
p.innerHTML = "Try again...";
}
</script>
我用来限制显示位数的函数，其中 x 是数字，n 是位数。这可以用在结果的显示上。要使用，只需取 results.innerHTML += ... + (100 * pdiff) + ... 并将函数 results.innerHTML += ... + limit_decimal(100 * pdiff, #) + ... 放在其中 # 是您想要的小数位数。
function limit_decimal(x, n) {
// Makes sure it is a number.
if(isNaN(x = +x)) return x;
// If n is not a number then set to zero.
isNaN(n = +n) && (n = 0);
// Makes x a string.
var s = x + "",
// Split the string up by the decimal.
parts = s.split(".");
// Return the first part if n is zero.
if(n === 0) return parts[0];
// If just the first part, place zeros.
if(parts.length === 1)
{
s += ".";
for(var i = 0; i < n; ++i)
s += "0";
return s;
}
// If not, then get the length.
var l = parts[1].length;
// If the length is larger than n, remove those.
if(l >= n)
{
return parts[0] + "." + parts[1].slice(0,n);
}
// Else, add zeros to fit the length.
for(var i = 0; i < n - l; ++i)
s+="0";
return s;
}
我正在努力做到这一点：
- 3个输入框
- 获取输入值并与特定百分比进行比较
如果值彼此相差在 3% 以内。输出=东西 否则输出其他东西。
如有任何帮助，我们将不胜感激。
这是一个代码示例，您可以从中导出逻辑。
https://jsfiddle.net/1u4c0jzj/
<input type="text" id="value1" />
<input type="text" id="value2" />
<input type="text" id="value3" />
<button id="checkValues">Check</button>
<div id="output" />
document.getElementById("checkValues").onclick = function(){
var value1 = parseFloat(document.getElementById("value1").value);
var value2 = parseFloat(document.getElementById("value2").value);
var value3 = parseFloat(document.getElementById("value3").value);
var maxValue = parseFloat(Math.max(Math.max(value1, value2), value3));
if(1-(value1 / maxValue) <= .03 && 1-(value2 / maxValue) <= .03 && 1-(value3 / maxValue) <= .03){
alert('all numbers are within 3% of each other')
}
else{
alert('numbers NOT within 3%');
}
}
它接受 3 个输入，找到最大值并确保所有 3 个数字都在最大值的 3% 以内。
只需对值进行排序并计算 relative change:
function calculatePercent(a, b, c) {
var values = [a, b, c];
values.sort(function (a, b) { return a - b; });
return (values[2] - values[0]) / values[0];
}
document.write(calculatePercent(100, 101, 102) + '<br>');
document.write(calculatePercent(80, 90, 100) + '<br>');
首先创建基本如下所示的输入：
<input type="text" width="3em">
这将创建一个输入标签。因此，放置三个或任意多个将创建输入。现在，我们需要一种方法来获取我们刚刚创建的输入。为此，我们需要一些 JavaScript.
document.getElementsByTagName("input");
这将使我们在屏幕上看到所有输入标签。现在，我们可以遍历这些标签并获取我们需要的数据，我将把这些数据放入数组中。
注意：每个输入标签都有一个名为 属性 的值，它存储放置在输入内部的字符串，可以通过在前面放置 + 将其更改为数字。
var numbers = [],
inputs = document.getElementsByTagName("input");
for(var i = 0; i < inputs.length; ++i)
{
var number = +inputs[i].value;
// Makes sure that a number is there.
if(!isNaN(number))
numbers.push(number);
}
现在我们已经将所有内容都放在一个数组中，是时候进行一些数学运算了！
让我们看一个简单的例子，比较一个特定数字与另一个数字的百分比。如果给定 7 和 3，它们之间的距离有多远？首先我们找到平均值 -> (7 + 3) / 2 然后我们找到 |3 - 7| 之间的差异，然后我们将差异除以平均值... 4 / 5 = .8。耶！但是，三个数字呢？好吧，现在我们必须在每个数字之间这样做......然后我们检查每个数字以查看是否在范围内。呸！为此，它需要一个嵌入式 for 循环。
所以，我们需要有一个嵌入式 for 循环，这样我们就不会重复比较。就像下面这样：
numbers => 1 2 3 4
Compare 1 -> 2, 1 -> 3, 1 -> 4
Compare 2 -> 3, 2 -> 4
Compare 3 -> 4
Stop!
这让我陷入了困境：
var inrange = true,
tolerance = 3/*In percentage!*/;
for(var i = 0; i < numbers.length && inrange; ++i)
for(var j = i + 1; j < numbers.length && inrange; ++j)
{
var diff = (numbers[i] - numbers[j]),
// Need to make sure diff is positive. Could use Math.abs...
pdiff = 2 * (diff < 0 ? -1*diff : diff)
/ (numbers[i] + numbers[j]);
// If false will cause the loops to stop.
inrange = (100 * pdiff) <= tolerance;
}
有了计算功能，我们现在可以专注于显示了！
现在，我们需要一个可以调用函数并为我们施展魔法的按钮！这也可以通过输入标签来完成，但是要改变它的类型。
<input type="submit" value="calculate" onclick="calculate()">
所以，现在我们需要一种方法来显示...一个非常简单的方法是使用带有 id 的 <p> 标签。
<p id="display"></p>
为了得到这个标签，我们也可以使用一些JavaScript。
document.getElementById("display");
这些标签有一个名为 innerHTML 的属性，我们可以在其中进行编辑，嗯...，更改内部 HTML。
var p = document.getElementById("display");
p.innerHTML = "Hello World!";
现在，我们可以结合上面的所有内容得到：
<input type="text" width="3em">
<input type="text" width="3em">
<input type="text" width="3em">
<input type="submit" value="calculate" onclick="calculate()">
<p id="display"></p>
<p id="results"></p>
<script>
// The tolerance for the numbers to be within.
var tolerance = 3,
// The number of inputs expected.
amount = 3;
function calculate() {
var numbers = [],
inputs = document.getElementsByTagName("input");
// Gets all of the numbers.
for(var i = 0; i < inputs.length; ++i)
// Need to check type to make sure not getting the button.
if(inputs[i].type === "text"){
var number = +inputs[i].value;
if(!isNaN(number))
numbers.push(number);
}
// Need to make sure the correct amount of inputs were found.
if(numbers.length !== amount) return;
var inrange = true,
// Gets the results p tag.
results = document.getElementById("results");
// Clear old results.
results.innerHTML = "";
// Compares each number finding the avg percent difference.
for(var i = 0; i < numbers.length && inrange; ++i)
for(var j = i + 1; j < numbers.length && inrange; ++j) {
var diff = (numbers[i] - numbers[j]),
pdiff = 2 * (diff < 0 ? -1*diff : diff)
/ (numbers[i] + numbers[j]);
inrange = (100 * pdiff) <= tolerance;
results.innerHTML += "Input " + (i+1) + " to " + (j+1)
+ ": " + (100 * pdiff) + " " + (inrange ? "<=" : ">") + " " + tolerance
+ " <br>";
}
// Gets the display tag.
var p = document.getElementById("display");
// Makes sure that within tolerance!
if(inrange)
p.innerHTML = "Within tolerance!";
else
p.innerHTML = "Try again...";
}
</script>
我用来限制显示位数的函数，其中 x 是数字，n 是位数。这可以用在结果的显示上。要使用，只需取 results.innerHTML += ... + (100 * pdiff) + ... 并将函数 results.innerHTML += ... + limit_decimal(100 * pdiff, #) + ... 放在其中 # 是您想要的小数位数。
function limit_decimal(x, n) {
// Makes sure it is a number.
if(isNaN(x = +x)) return x;
// If n is not a number then set to zero.
isNaN(n = +n) && (n = 0);
// Makes x a string.
var s = x + "",
// Split the string up by the decimal.
parts = s.split(".");
// Return the first part if n is zero.
if(n === 0) return parts[0];
// If just the first part, place zeros.
if(parts.length === 1)
{
s += ".";
for(var i = 0; i < n; ++i)
s += "0";
return s;
}
// If not, then get the length.
var l = parts[1].length;
// If the length is larger than n, remove those.
if(l >= n)
{
return parts[0] + "." + parts[1].slice(0,n);
}
// Else, add zeros to fit the length.
for(var i = 0; i < n - l; ++i)
s+="0";
return s;
}