document.ready에서 JavaScript 함수 호출

문서가 완료되면 JavaScript를 사용하여 HTML의 단락 요소 값을 설정하려고하지만 작동하지 않는 것 같습니다. 빨간색 밑줄로 사진에서 document.ready에서 JavaScript 함수 호출

은, 내가 지시 한 : 이미 구글의 CDN에서 jQuery 라이브러리를 포함했다

1).

2) 이미 "링크 된"(올바른 단어가 무엇인지 확실하지 않음) .ts 파일을 내 HTML 파일과 함께 사용합니다. 이미 단락 요소에 "필러"는 script.ts 파일에

<!DOCTYPE HTML> 
<head> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">  <!-- Makes me host Bootstrap --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>  <!-- Not sure if I'll need this --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://use.fontawesome.com/4c5e04f914.js"></script> 
    <script src="http://api.openweathermap.org/data/2.5/forecast?id=524901&APPID={178e8d4180edebe4e2c02fcad75b72fd}"></script> 
    <script src="../js/script.ts"></script> 

</head> 
<body> 
    <div class="jumbotron text-center"> 
     <h1 id="filler">Weather Wizard</h1> 
     <p>Finding your local weather!</p> 
     <!-- Your current location is: --> 
     <p id="currentCity"></p> 
    </div> 
</body> 
</head>

의 ID를 설정 한

3), 내가 가진 :

4) 내의 getLocation() 메소드 호출 document.ready 콜백 함수 내부

5) 무언가 ID = "필러"로 소자의 HTML을 설정하려고

$(document).ready(function() { 
getLocation(); 

/** 
* called when the user clicks the "find weather" button 
* get the user's current location, shows an error if the browser does not support Geolocation 
*/ 
function getLocation(): void { 
    document.getElementById("filler").innerHTML = "is this showing up?"; 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(locationSuccess, locationError); 
    } else { 
     showError("Your browser does not support Geolocation!"); 
    } 
}

불행히도 브라우저에서 HTML 파일을로드 할 때 id = "filler"인 텍스트가 "is this showing up?"으로 변경되지 않습니다.

나는 또한 repl.it에서 비슷한 것을 만들려고했는데 거기에 의도 된대로 작동합니다. I 누락/잘못하고 있어요 무엇

https://repl.it/@jonathanwangg/test

출처

2017-12-20 Jonathan Wang

코드의 사진이 아니라 코드를 게시하십시오. – Intervalia

또한 자바 스크립트 대신 타이프 스크립트에 태그를 붙여야합니다 – zfrisch

이미지를 코드로 변경하고 태그를 추가했습니다. 희망이 도움이됩니다. –

브라우저가 입력 스크립트를 인식하지 못합니다. : void 부분에 대해 불평합니다. 파일을 일반 자바 스크립트로 컴파일하거나 자바 스크립트 만 작성해야합니다. : void을 제거하면 제대로 작동합니다.

또한 openweathcermap api를 스크립트 src로로드하면 안됩니다. jQuery를로드하면 jQuery ajax 함수를 사용하여 API 호출을 수행 할 수 있습니다.

출처

2017-12-21 01:20:16 eltongonc

타이프 스크립트 일에 대해 머리를 주셔서 감사합니다. 또한 왜 openweathermap을 스크립트 src로로드하면 안됩니까? 대신 jQuery AJAX를 사용할 때의 이점이나 결과는 무엇입니까? –

openweathermap은 Object에서 해결됩니다. ''에서받은 객체를 조작 할 방법이 없지만 AJAX로 완벽하게 제어 할 수 있습니다. 'var obj = ajaxResponse [2] '또는 뭐든간에. – eltongonc

JSON 응답에서 특정 값을 사용하려고합니다. 해당 API를 호출하지 못했습니다. 내가 현재 사용하고있는 것은 jQuery의 $ .get()이다. 너가 말하는게 이거니? –

document.ready에서 JavaScript 함수 호출

답변

관련 문제