Javascript max和min无法正常工作

时间:2015-02-09 03:34:10

标签: javascript input max min

我正在尝试创建一个页面,让用户输入三个数字,并在输入下方打印最大值和最小值。我已经使用了Math.max / min函数并尝试了if语句但是当我点击提交时没有显示任何内容。非常感谢一些见解,谢谢!

function max() {
    var x = document.getElementById("num1").value;
    var y = document.getElementById("num2").value;
    var z = document.getElementById("num3").value;

    var maximum = Math.max(parseInt(x), parseInt(y), parseInt(z));

    document.getElementById("max").innerHTML= maximum;
    }
    function min() {

    var x = parseInt(document.getElementById("num1").value);
    var y = parseInt(document.getElementById("num2").value);
    var z = parseInt(document.getElementById("num3").value);


    document.getElementById("min").innerHTML = Math.min(x,y,z);
    }

这是我的HTML

<p>Enter First Number:</p>
<input type="text" name = "number1" id="num1"><br>
<p>Enter Second Number</p>
<input type="text" name = "number2" id="num2"><br>
<p>Enter third number</p>
<input type="text" name = "number3" id="num3"><br>

<input type="submit" value="Submit" onclick="max(); min(); "><br /> 
<p>Max =</p><p id ="max"></p><br />
<p>Min =</p><p id ="min"></p><br />

4 个答案:

答案 0 :(得分:2)

<input type="submit"/>替换为<button type="submit" value="" onclick="minmax();">Submit</button>

并添加JS函数:

function minmax() {
    min();
    max();
}

答案 1 :(得分:1)

您的问题似乎与您举办活动的方式有关。

使用时可以正常工作:

document.querySelector( '[type="submit"]' ).addEventListener( 'click', function() {
   max();
   min();
}, false );

http://jsfiddle.net/yemxrmqq/

答案 2 :(得分:0)

您只需更改与按钮相关的标记,而不是:

<input type="submit" value="Submit" onclick="max(); min(); "><br />

刚刚提出:

<button type="submit" value="Submit" onclick="max(); min()">Click</button><br />

答案 3 :(得分:0)

这里的答案都没有告诉你为什么你的代码不起作用。

内联侦听器中的标识符首先被解析为放置它们的元素的属性。 Input elements具有默认的 max 属性,因此在内联侦听器中,标识符 max 将引用输入的 max 属性。因此,在任何文件中:

<input onclick="console.log(max)">

显示''(即空字符串)。

因此,您可以将函数的名称更改为更有意义的名称,或者更改调用它们的上下文,以便在元素上不解析标识符,并且OP代码可以正常工作。 e.g。

<input type="submit" value="Submit" onclick="callBoth()">

function callBoth() {
  max();
  min();
}

顺便提一下,表单外部的输入类型提交只是一个按钮,因此您应该使用:

<input type="button" ...>