2012-02-19 2 views
4

내가 만든 JQuery 함수가있는 .js 문서를로드하는 문서를 만들었습니다. firebug 콘솔을 사용하여 HTML 문서에서 이러한 기능의 기능을 신속하게 테스트하고 싶습니다. 그러나 콘솔에서 이러한 함수를 호출하려고하면 응답이 없습니다. 예를 들어firebug 콘솔에서 사용자 정의 함수 호출하기

:

  • 내 JS 전화 index.html을 가지고

    <script src="jquery.js" type"text/javascript"></script> 
    <script src="myfunctions.js" type="text/javascript"></script> 
    
  • Myfuntions.js이가 거기에 정의 된 다음했습니다

    function showAbout(){ 
        $('div#about').show("slow"); 
        $('.navbar #about-button').attr('disabled', true); 
    } 
    

문제 :

showAbout 또는 을 콘솔의 index.html에서 호출하려고하면 아무 것도 변경되지 않습니다. 그러나 $('div#about').show("slow"); 또는 $('div#about').show("slow");을 콘솔에서 직접 호출하면 예상되는 동작이 발생합니다.
콘솔에서 사용자 정의 함수를 호출하는 적절한 방법은 무엇입니까?

답변

22

showAbout가 전역 범위에서 정의 된 경우 콘솔에 showAbout();을 작성하고 그 결과를 볼 수 있어야합니다. 그렇지 않으면, 그때는 아마 지금처럼 범위 지정 기능에 기능을 옮기고 :

(function() { 
    function showAbout() { 
    } 
})(); 

그렇다면, 당신에 대한 좋은, 당신은 생성 된 전역 변수/기능을 피했다. 그러나 콘솔이 전역 범위에만 액세스 할 수 있기 때문에 콘솔에서 해당 기능에 액세스 할 수 없음을 의미합니다.

당신은 당신이 (디버깅을 위해, 일시적으로 만 아마도) 콘솔에서 사용할 수 있도록 그 중 하나를 내보낼 경우,이 같은 것을 할 수있는 명시 적으로에 showAbout 속성을두고

(function() { 
    window.showAbout = showAbout; 
    function showAbout() { 
    } 
})(); 

을 함수를 참조하는 전역 객체 (window). 그러면 콘솔에 showAbout();이 작동합니다.

+4

당신은 천재이기 때문에 –

+0

왜이 기능을 만들기 위해 괄호 안에 함수를 래핑하고 뒤에 다른 괄호 세트를 넣어야합니까? ** (** function() {...} **)() **; – Ricalsin

+0

@Ricalsin : 괄호 자체는 필요하지 않지만 * 뭔가 *는 파서가 함수 * 선언 *이 아닌 함수 * 표현 *을 처리한다는 것을 이해할 필요가 있기 때문에 필요합니다. 함수 표현식은'()'을 맨 끝에 붙이면 바로 나타나지만 함수 * 선언 *을 그렇게 호출 할 수는 없습니다. [이 다른 질문에] (http://stackoverflow.com/q/13341698/157247) 및 내 대답은 그것. :-) –

2

은 아마도 전체 범위에 속하지 않습니다.

코드는 $(document).ready() 코드로 묶을 수 있으며 범위는 해당 기능으로 제한됩니다.

테스트를 위해, 당신은 함수가 정의되고 나면 그런 다음, 콘솔에서 showAbout()를 호출 할 수 있습니다 ... 아래

window.showAbout = showAbout; 

을 추가 할 수 있습니다.