Javascript代码嵌入在HTML中

时间:2016-08-03 09:14:17

标签: javascript html

我有一个JS代码来计算数字的倍数。我想在我的HTML文件中加入相同的内容。所以当我点击"提交"按钮,它给了我答案。以下是我的代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta author="Shruti Paliwal">
<title>Project Euler Solutions</title>
<script language="javascript" type="text/javascript">
    function multiples()
    {
        var i;
        sum=0;
        for(i=1;i<1000;i++)
        {
            if(i%3 === 0 || i%5 === 0)
                {
                    sum+=i;
                }

        }

    }
    document.getElementById('sum').value = sum;
</script>
</head>
<body>
<h3>
<div id="header">
Project Euler
<sub>.net</sub>
</h3>
</div>
<br />
<br />
<p class="problem1" id="problem">
<b>
Multiples of 3 and 5
</b>
<div class="boundary" id="boundary">
<div class="content">
If we list all the natural numbers below 10 that are multiples of 3 or   5, we get 3, 5, 6 and 9. The sum of these multiples is 23.
<br />
Find the sum of all the multiples of 3 or 5 below 1000.
<br />
<br />
<form>
<input type="text" name="value">
<input type="button" onclick="sum()" value="Submit" />

</form>
</div>
</p>
</div>
</style>
</body>
</html>

需要帮助才能在我的网页上显示此代码的输出。计算倍数的逻辑在JS控制台上运行良好。但是,没有得到如何合并2 !!

2 个答案:

答案 0 :(得分:1)

将您的代码更改为:

<p class="problem1" id="problem">
    <b>
        Multiples of 3 and 5
    </b>
    <div class="boundary" id="boundary">
        <div class="content">
            If we list all the natural numbers below 10 that are multiples of 3 or   5, we get 3, 5, 6 and 9. The sum of these multiples is 23.
            <br />
            Find the sum of all the multiples of 3 or 5 below 1000.
            <br />
            <br />
            <form>
                <p>Enter number 1:</p><input type="text" id="txtNumber1">
                <br />
                <p>Enter number 2:</p><input type="text" id="txtNumber2">
                <br />
                <br />
                <input type="button" onclick="multiples()" value="Submit" />

                <input type="text" name="value" id="sum">


            </form>
        </div>

    </div>
<script language="javascript" type="text/javascript">
    function multiples() {
        ////Jquery
        //var number1 = $("#txtNumber1").val();
        //var number2 = $("#txtNumber2").val();

        //Javascript
        var number1 = document.getElementById('txtNumber1').value;
        var number2 = document.getElementById('txtNumber2').value;

        if (number1.trim() == '' || number2.trim() == '')
        {
            alert('please enter number1 and number2');
            return false;
        }

        var i;
        sum = 0;
        for (i = 1; i < 1000; i++) {
            if (i % number1 === 0 || i % number2 === 0) {
                sum += i;
            }

        }
        document.getElementById('sum').value = sum;
        return false;
    }
</script>

答案 1 :(得分:0)

Javascript 101

<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "YOU CLICKED ME!";
}
</script>
 <button onclick="myFunction()">Click me</button> 

OR

function calculate() {
    var myBox1 = document.getElementById('box1').value; 
    var myBox2 = document.getElementById('box2').value;
    var result = document.getElementById('result'); 
    var myResult = myBox1 * myBox2;
    result.innerHTML = myResult;

}
<input id="box1" type="text" />
<input id="box2" type="text" />
<div id="result"></div>
<input type="submit" onclick="calculate()"/>