애드프로 님 답변 참고해 코드를 수정해 봤는데,,,

애드프로 님 답변 참고해 코드를 수정해 봤는데,,,

QA

애드프로 님 답변 참고해 코드를 수정해 봤는데,,,

본문

애드프로 님 답변 https://sir.kr/qa/323770

 


<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
.hz {width:100px; height:100px; }
.r {background: red;}
.b {background: blue; display: none;}
</style>
<div class="hz r"></div>
<div class="hz b"></div>
<button onmouseover="r()">red</button>
<button onmouseover="b()">blue</button>
<script>
//$(document).ready(function() {  <---- 이 부분이 있으면 작동 X
  function r(){
     $('.hz').css('display','none'); $('.r').css('display','block');
  }
  function b(){
     $('.hz').css('display','none'); $('.b').css('display','block');
  }
//}); <---- 이 부분이 있으면 작동 X
</script>

 

왜 ready 메서드가 존재하면 작동 안 하는지 궁금합니다.

https://codepen.io/sinbi/pen/BaBqjPo 작동 O

https://codepen.io/sinbi/pen/zYOmrPp 작동 X

 

이 질문에 댓글 쓰기 :

답변 3

저 함수를 ready 내에 넣어야할 이유도 없지만 넣으면 안되는 이유는

ready이부분도 결국은 함수 거든요

함수내의 값들은 전역으로 설정한 값이 아니면 외부에서 참조하거나 호출할 수가 없는 거죠

ready내에 aaa= 10이라고 설정하고 ready밖에서 aaa를 찾아보면 값이 없죠

아래처럼

<script>
$(function(){
  var aaa=10;
});

function kkk(){alert(aaa);}
</script>
<a href="javascript:kkk()">kkk</a>

 

function kkk()를 ready내에 넣으면 마찬가지로 찾을 수가 없게되죠

 

 

그것은 함수를 ready안에 method 형태로 (지역함수)로 선언해서 그렇습니다.

 


<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
.hz {width:100px; height:100px; }
.r {background: red;}
.b {background: blue; display: none;}
</style>
<div class="hz r"></div>
<div class="hz b"></div>
<button onmouseover="r()">red</button>
<button onmouseover="b()">blue</button>
<script>
$(document).ready(function() {
  r();  //굳이 부르겠다면 이렇게
  b();
});
  function r(){
     $('.hz').css('display','none'); $('.r').css('display','block');
  }
  function b(){
     $('.hz').css('display','none'); $('.b').css('display','block');
  }
</script>

 

와 같이 선언부를 나누고 불러도 되지만

 

ready는

body 태그의

Onload에서 실행되는것과 유사한 구조라서 

실제 마우스 오버이벤트가 작동하려면

함수가 밖으로 나와있어야죠

 

 

답변을 작성하시기 전에 로그인 해주세요.
전체 33
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT