웹 개발 완전 기초적인 질문입니다!

조회수 1658회

로컬 서버를 열어두고, 간단한 프론트 앤드 코드를 실행했는데 익플에선 무리없이 돌아가는데 크롬에선 제대로 돌아가지 않습니다.

화면 구성에 단순하게 아이콘 하나가 있고 그걸 클릭하면, 즉 onclick시에 자바스크립트 파일에 있는 제가 임의로 만든 함수를 호출하는 내용인데요, 이 함수는 그냥 get해서 ajex를 이용해 서버에서 제이슨 타입의 데이터를 받아옵니다.

사실 콘솔에 찍어보니 함수 내용의 문제가 아니고 아예 클릭시에 제가 정의한 함수 자체가 실행되지 않는데, 왜 그런걸까요?

익플에선 정상적으로 함수도 잘 돌아가고 데이터도 잘 받아오는데 크롬에선 정의한 함수 자체가 실행되지 않습니다. 콘솔에 찍히는걸 보면 자바스크립트 자체는 잘 불러오는데요..

왕초보에게 도움주시면 감사하겠습니다!

  • (•́ ✖ •̀)
    알 수 없는 사용자

1 답변

  • onclick attribute 을 쓰는것보다 JavaScript에서 dom을 잡아 addeventlistener를 주는것이 어떨까요? 예를 들어

    <div onclick="myFunc()">가나다라마바사</div>
    

    위코드를 하는것보다 html에 id를 주어 만들고 JavaScript에서 DOM을 잡아 event를 바인딩 하는게 더 좋을것 같습니다. 아래 처럼

    <div id="my-div">가나다라마바사</div>
    <script>
      var myDiv = document.querySelector('#my-div');
      myDiv.addEventListener('click', myFunc);
    </script>
    

    이렇게 해도 해결이 않된다면 혹시 <a></a> tag를 사용하셨으면 그럴수도 있습니다. 예를 들어;

    <a href="#" onclick="myFunc()"></a>
    

    위 처럼 코드를 사용하게 되면 href때문에 onclick이 브라우저 마다 잘못 실행 될수 있습니다.
    href를 빼주시고 해보시면 어떨까요?

    위 같은 문제를 많이 접하신다는 것은 JavaScript로 개발하는게 즐거우신것 같은데요. 조금만더 공부하시면 더 멋진 것도 만드실수 있을것 같습니다. 왜냐면 JavaScript로 서버와 로봇도 만들수 있기 때문입니다.

    JavaScript를 배울수 있는 방법은 여러가지가 있는데요.

    제가 일하는 회사 사이트에서 JavaScript 풀스택 개발자 되는 방법을 공짜로 나눠주고 있습니다. 풀스택 개발자란 JavaScript를 사용하여 웹사이트는 물론 서버, 로봇 등등을 만들수 있는 개발자를 말합니다.

    www.svcoding.com 에 가셔서 이메일 적어주시면 보내주니 한번 확인해 보세요.

    • (•́ ✖ •̀)
      알 수 없는 사용자

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)