Question

我正在使用javascript创建3个文本框和一个按钮，然后向按钮添加一个监听器，然后获取3个文本框的值并返回最大的数字。

这是我用来生成文本框的代码：

var elementID = ['a', 'b', 'c'];

for(i=0; i<elementID.length; i++) {
    var inputElement = document.createElement('input');
    inputElement.setAttribute('type', 'text');
    inputElement.setAttribute('id', elementID[i]);
    document.body.appendChild(inputElement);
}

我尝试直接在HTML中添加框，但它返回相同的错误结果。

以下是添加按钮和附加事件监听器的代码：

var eventHandler = function(event) {
    var a = document.getElementById('a').value;
    var b = document.getElementById('b').value;
    var c = document.getElementById('c').value;

    alert(largestNumber(a, b, c));
};

var button = document.createElement('button');
button.setAttribute('id', 'button');
button.textContent = "Submit";
document.body.appendChild(button);
button.addEventListener('click', eventHandler);

这是我用来计算最大数字的代码：

var largestNumber = function(a, b, c) {
    return (((a>b) ?a:b) > c) ? (a>b?a:b):c;
};

起初我认为这可能是上述代码的一个问题所以我尝试使用旧的if else，但它仍然没有用。

问题在于它返回了错误的数字，例如 - 如果我在第一个框中输入63，在秒中输入210，在第三个框中输入57，它将返回63作为最大数字。

最后，这是工作fiddle。

Answer 1

您可以将largestNumber功能重写为：

var largestNumber = function() {
    return Math.max.apply(null, arguments);
};

Answer 2

使用Math.Max

var largestNumber = function(a, b, c) {
    var arr = [a, b, c];
    return Math.max(...arr);
};

请参阅小提琴https://jsfiddle.net/prsLocjw/5/

Answer 3

您的数字将作为字符串值进行比较。首先尝试使用parseInt函数将它们转换为数字：

var eventHandler = function(event) {
    var a = parseInt(document.getElementById('a').value);
    var b = parseInt(document.getElementById('b').value);
    var c = parseInt(document.getElementById('c').value);

    alert(largestNumber(a, b, c));
};

＆＃13;

var largestNumber = function(a, b, c) {
  return (((a > b) ? a : b) > c) ? (a > b ? a : b) : c;
};

var elements = [{
  id: 'a',
  val: 63
}, {
  id: 'b',
  val: 210
}, {
  id: 'c',
  val: 57
}];
for (i = 0; i < elements.length; i++) {
  var inputElement = document.createElement('input');
  inputElement.setAttribute('type', 'text');
  inputElement.setAttribute('id', elements[i].id);
  inputElement.value = elements[i].val;
  document.body.appendChild(inputElement);
}

var eventHandler = function(event) {
  var a = parseInt(document.getElementById('a').value);
  var b = parseInt(document.getElementById('b').value);
  var c = parseInt(document.getElementById('c').value);

  console.log(largestNumber(a, b, c));
};

var button = document.createElement('button');
button.setAttribute('id', 'button');
button.textContent = "Submit";
document.body.appendChild(button);
button.addEventListener('click', eventHandler);

＆＃13;

Answer 4

此处的问题是您的值 NOT 已转换为数字。 Javascript会比较导致您看到的意外结果的字符串。可以使用h = { a: 1, b: 2, c: 1, d: 3, e: 2 } h.each_with_object({}) { |(k,v),g| (g[v] ||= []) << k } #=> {1=>[:a, :c], 2=>[:b, :e], 3=>[:d]}或Math.max()（检查Math.max()和Function.prototype.apply()）来解决此问题，因为Math.max.apply()函数会尝试将其参数转换为数字（请参阅< strong> CD .. 的回答）或者通过将值显式转换为数字（例如，通过Math.max()，但也许你的数字不是整数，例如，1.3和1.5那么你可以使用{{1功能）由 Moishe 提出。

Answer 5

问题是value的返回类型为string，largestNumber函数的预期类型为number。进行字符串比较时，它会比较每个字符的UTF-16代码单位值。在这种情况下，第一个数字是63，第二个数字是210。由于'6' > '2'，您的函数始终返回63。

您需要将函数调用更改为：alert(largestNumber(Number(a), Number(b), Number(c)));。

除了错误之外，最好使用static内置Math.max函数，而不是编写自己的实现。它会： a）简化你的代码，b）将更可靠，更高效，更易读，并且c）在你想比较3个以上的数字的情况下，它将面向未来。

Answer 6

请使用此功能 alert（largestNumber（parseInt（a），parseInt（b），parseInt（c）））;

为什么使用javascript生成的按钮无法正常工作？

6 个答案: