2014-11-12 3 views
1

내 코드가 jsfiddle에서 작동하지만 브라우저에서 작동하지 않습니다. 여기에 무엇을 놓쳤는지 알 수 없으므로 해결책을 알려주십시오. 내가 그것을 구글하지만 난이 올바른 해결책이 저를 도와주세요지고 있지 않다 이 jsfiddle은 onload 이벤트에 자동으로 싸서 http://jsfiddle.net/pLTrJ/9/javascript 코드가 jsfiddle에서 작동하지만 브라우저에서 작동하지 않습니다.

<!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> 
+0

콘솔에 오류가 있습니까? 예상되는 결과는 무엇입니까? – Andy

+0

http://code.jquery.com/jquery-latest.min.js를 사용하지 마십시오. 항상 jquery 1.11.1을 참조합니다! 읽기 : http://stackoverflow.com/questions/441412/is-there-a-link-to-the-latest-jquery-library-on-google-apis – Refilon

+0

@Andy는이 링크를 확인할 수 있습니다. http : // jsfiddle.net/pLTrJ/9/ – rizwan

답변

4

jsfiddle 링크를합니다. HTML 페이지에서이 작업을 수행하지 않았으므로 브라우저에서 실행될 때 렌더링되기 전에 div를 확보하려고하므로 theDiv은 null입니다.

아래의 작업을해야합니다 :

<!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> 
+0

또한 jquery를 사용하여'$ (document) .ready();'를 언급 할 수 있습니다. – SBI

+0

jQuery에 대한 유일한 참조는 포함 된 스크립트입니다. 실제로 아무 데서도 사용되지 않았고 질문에 태그도 지정되어 있지 않습니다. –

+0

@JamesThorpe 정말 제임스에게 감사드립니다.하지만 한 가지 의미는 무엇을 의미하는지 이해하지 못했습니다. (문서) .ready(); – rizwan

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> 

가 (난 그냥 바닥에 스크립트를 넣어 당신의 요소 다음 스크립트로드가 설정되어 그래서..)

+0

제임스가 정상적으로 작동하고 있다고 대답 했으므로 해결책이 잘 작동합니다. 감사합니다. – rizwan

+0

안녕하세요. 그의 해결책은 나의 것보다 낫다. :-) –

관련 문제