单击按钮后,使用javascript将计算结果添加到跨度中

Question

嗨,我是javascript的新手,我希望你能帮我找出为什么在用户点击使用最小和最大数字的计算按钮后,我无法得到随机数生成器的结果出现在span标签中进入.我相信随机数函数没有任何问题,当我想使用随机数函数作为onclick事件的事件处理程序时,它不起作用的按钮.好吧,我做的是,我创建了一个名为answer的函数来收集用户输入并将该输入用作在answer函数内调用的随机数函数的参数.

然后我使用了回答函数作为onclick的事件处理程序,认为它将具有随机数生成器的结果并将其应用于onclick.我将其存储在var存储中,因此我可以稍后将事件的结果放在span标记中.

这是代码的js小提琴.你可以通过在按钮$("计算")点击之后将random_number函数的结果输入到span $("output")来帮助我解决我的问题吗？

只有纯粹的javascript,请不要jquery.

预先感谢您的帮助.如果我的术语错误且拼写错误,我很抱歉.http://jsfiddle.net/jack2ky/WDyMd/

        <label for="min">Enter the min:</label>
    <input type="text" id = "min" /> <br />

    <label for="max">Enter the max:</label>
    <input type="text" id = "max" /> <br />

    <input type="button" id = "calculate" value = "calculate"/>
    <span id ="output">&nbsp;</span>
<script>

    var $ = function(id){
        return document.getElementById(id);
    }
window.onload = function () {


    var random_number = function(min, max, digits){
        digits = isNaN(digits) ? 0 : parseInt(digits);

        if(digits < 0){
            digits = 0;
        }else if (digits > 16){
            digits = 16
        }
        if(digits == 0){
            return Math.floor(Math.random() * (max - min +1)) +min;
        }else {
            var rand = Math.random() * (max - min) + min;
            return parseFloat(rand.toFixed(digits));
        }
    }


    var storage = $("calculate").onclick = answer;

     var answer = function(){
            var miny = $("min").value;
            var maxy = $("max").value;
            return random_number(miny, maxy);
     }
    $("output").firstChild.nodeValue = storage;

}

</script>

</body>
</html>

Answer 1

var storage = $("calculate").onclick = answer;
...
$("output").firstChild.nodeValue = storage;

这两个语句在页面加载时调用。发生的情况是您正在更改变量的值storage，但该语句var storage = $("calculate").onclick = answer; 在页面加载时仅被调用一次。当用户单击按钮时，您需要更新答案。因此，您可以删除$("output").firstChild.nodeValue = storage;并更新答案函数，例如：

 var answer = function(){               
                var miny = parseInt( $("min").value );              
                var maxy = parseInt( $("max").value );                      
                var ans = random_number(miny, maxy);                
                $("output").innerHTML = ans;
         }