0

我仍然在搞乱这个用 JavaScript 编码的计算器。我在问这个问题,我该如何让它停止显示输出警报并将其打印到名为“Output”下面的 div 标签中。

我已经将我认为应该在输出中的内容放入其中,并将其粘贴在下面:

 <html>
    <head>
    <link href="stylesheet/stylesheet.css" rel="stylesheet" type="text/css">

    <script type="text/javascript">



    function checkinputs(){
    var     A = parseInt(document.triangleform.input1.value);
    var     B = parseInt(document.triangleform.input2.value);
    var     C = parseInt(document.triangleform.input3.value);


        if (A == B && B == C) { alert("Equalateral"); } 
        if (A == B && B != C || B == C && A != B || C == A && A != B) {alert("Isosceles");} 
        if (A != B && B != C && C != A) {alert("Scalene!");} 
    }



    function keypress(evt) {
      var theEvent = evt || window.event;
      var key = theEvent.keyCode || theEvent.which;
      key = String.fromCharCode( key );
        var regex = /[0-9]|\./;
      if( !regex.test(key) ) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
      }
    }

    function notEmpty(field, NocharMsg){
        if(field.value.length == 0){
            alert(NocharMsg);
            field.focus();
            return false;
        }
        return true;
    }
    </script


    </head>
    <body>
    <div id="Container">

    <div id="Header"><h1></h1></div>

            <div id="Content_1">
                    <div id="Explanation">
                    This calculator will determine what
                    triangle you have made depending on
                    the integer values in the input fields.

                    </div>
                    <div id="Form">
                        <FORM NAME="triangleform">
                        Enter the triangle values below: <br>
                        <p>
                        <h4>Side 1: </h4><BR>
                        <INPUT TYPE="Integer" NAME="input1" onkeypress='keypress(event)' /><P>
                        <h4>Side 2: </h4><BR>
                        <INPUT TYPE="Integer" NAME="input2" onkeypress='keypress(event)' /><P>
                        <h4>Side 3:</h4> <BR>
                        <INPUT TYPE="Integer" NAME="input3" onkeypress='keypress(event)' /><P>
                        <INPUT TYPE="button" NAME="Submit" Value="Submit" onClick="checkinputs()" />
                        </FORM>
                    </div>
                    <div id="Verbal_Output">
                        <h2>You made a:</h2>
                        <p>        
                        <h2>Triangle</h2>
                    </div>

                </div>
                <p>
                <p>
            <div id="Content_2">

            <div id="Output">
            <script>
            document.getElementById("Output").value = checkinputs();

            </script>   
            </div>



    </body>
    </html>

非常感谢。

4

2 回答 2

2

几乎在那里 - 一个 div 没有value属性(用于表单输入),但它确实有一个innerHTML属性。只要确保你return得到你想要的值checkInputs(),而不是alerting 他们。

例如:

function checkinputs() {
    var A = parseInt(document.triangleform.input1.value),
        B = parseInt(document.triangleform.input2.value),
        C = parseInt(document.triangleform.input3.value),
        result;


    if (A == B && B == C) { result = "Equilateral"; } 
    if (A == B && B != C || B == C && A != B || C == A && A != B) { result ="Isosceles";} 
    if (A != B && B != C && C != A) { result = "Scalene!";} 

    // return result;
    document.getElementById("Output").innerHTML = result;
}

然后在您的标记中:

<script>
        document.getElementById("Output").innerHTML = checkinputs();
</script>

请注意,.innerHTML区分大小写。

于 2012-09-19T14:49:12.910 回答
-1
function checkinputs(){  
    var A = parseInt(document.triangleform.input1.value);
    var B = parseInt(document.triangleform.input2.value);
    var C = parseInt(document.triangleform.input3.value);

    if (A == B && B == C) { $('#output').html("<div>Equalateral</div>");}
    if (A == B && B != C || B == C && A != B || C == A && A != B) {$('#output').html("<div>Isosceles</div>");}
    if (A != B && B != C && C != A) {$('#output').html("<div>Scalene!</div>");}
}  
于 2012-09-19T15:02:48.693 回答