在jsfiddle中工作但在浏览器中无法工作的javascript代码

时间:2014-11-12 10:32:03

标签: javascript html5

我的代码在jsfiddle工作,但没有在浏览器中工作我不知道我错过了什么,请你检查一下并告诉我解决方案。我谷歌它,但我没有得到正确的解决方案,请帮助我 这是jsfiddle链接http://jsfiddle.net/pLTrJ/9/

   <!doctype html>
     <html>
      <head>
        <script src="http://code.jquery.com/jquery-latest.min.js"  type="text/javascript">   </script>
      </head>
      <script type="text/javascript">
        var random = 0;
        var theDiv = document.getElementById("showVal");
        updateTheDiv(9,0);
        function updateTheDiv(inRange, inMin) {
        random = (Math.random()*inRange+inMin)|0; 
        theDiv.innerHTML = random;
        var nextCall = (Math.random()*1000)|0;
        setTimeout(function() {
        updateTheDiv(inRange, inMin);
            }, nextCall);
        }
      </script>
        <body>
          <div id="showVal"></div>
        </body>
   </html>

2 个答案:

答案 0 :(得分:4)

jsfiddle已将其自动包装在onload事件中。你还没有在HTML页面中这样做,所以当它在浏览器中运行时,你试图在渲染之前抓住div,所以theDiv为空。

以下应该有效:

<!doctype html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript">   </script>
</head>
<script type="text/javascript">
    window.onload = function () {
        var random = 0;
        var theDiv = document.getElementById("showVal");
        updateTheDiv(9, 0);
        function updateTheDiv(inRange, inMin) {
            random = (Math.random() * inRange + inMin) | 0;
            theDiv.innerHTML = random;
            var nextCall = (Math.random() * 1000) | 0;
            setTimeout(function () {
                updateTheDiv(inRange, inMin);
            }, nextCall);
        }
    }
</script>
<body>
    <div id="showVal">
    </div>
</body>
</html>

答案 1 :(得分:0)

在浏览器中尝试此操作;)

<!doctype html>
 <html>
  <head>
    <script src="http://code.jquery.com/jquery-latest.min.js"  type="text/javascript">   </script>
  </head>

    <body>
      <div id="showVal"></div>
    </body>


<script type="text/javascript">
    var random = 0;
    var theDiv = document.getElementById("showVal");
    updateTheDiv(9,0);
    function updateTheDiv(inRange, inMin) {
    random = (Math.random()*inRange+inMin)|0; 
    theDiv.innerHTML = random;
    var nextCall = (Math.random()*1000)|0;
    setTimeout(function() {
    updateTheDiv(inRange, inMin);
        }, nextCall);
    }
  </script>
</html>

(我只是将脚本放到底部。所以在设置元素后加载脚本。)