이 jQuery 범위 오류를 수정하는 방법은 무엇입니까?

Question

이 코드에서 알 수없는 것, 범위가 좁은 문제라고 생각합니다.

나는 다음과 같은 자바 스크립트 내가 만들 수 있기 때문에 다음

<div id="dialog" title="Message Info"></div> 
<input type="button" id="btnCommand1" value="Command 1" onclick="javascript: showMessage('Outgoing', 1000487874')" /> 
<input type="button" id="btnCommand2" value="Command 2" onclick="javascript: showMessage('Incoming', 2000237851')" /> 

나는 또한 jQuery를 통해 클릭 이벤트를 바인딩 할 수 있음을 이해

하지만 처럼 전화를 원하는

<javascript language="javascript> 
    $(function() { 
     $("#dialog").dialog({ 
      autoOpen: false 
     }); 

     function getMessage(direction, msgId) { 
      return "This is an " + direction + " message with ID: " + msgId; 
     } 

     function showMessage(direction, msgId) { 
      $("#dialog").text(getMessage(direction, msgId)); 
      $("#dialog").dialog('open'); 
     } 
    }); 
</script> 

을 니펫을했다 그 버튼을 동적으로 위에서 언급 한 것처럼 호출해야합니다. showMessage()가 정의되지 않은 오류가 발생하는 문제. 일반적으로 jQuery scope $ (function() {}) 내에 정의 된 메소드는이 범위 밖에서 접근 할 수 없다는 것을 알았다. 어떻게 해결할 수 있을까요?

Answer 1

당신하여 $() 준비 핸들러 내부에 모든 것을 넣을 필요가 없다. 이것은 실제로 페이지가 준비되었음을 알기위한 필수적인 요소입니다.

후기 바인딩이 좋지만 작동하도록하십시오. 어떻게 해결할 수 있을까요?live()를 사용하여 jQuery를 $() 기능에

바인딩 : 매개 변수가 동적 인 경우

$(function(){ 
    .... 
    function showMessage(direction, msgId) { 
     $("#dialog").text(getMessage(direction, msgId)); 
     $("#dialog").dialog('open'); 
    } 

    $("#button1").live("click", function(){ 
     showMessage('Outgoing', 1000487874); 
    }); 
}); 

데이터 속성으로, 당신이 그 (것)들을 포함 할 수

<input type="button" id="btnCommand1" value="Command 1" data-param1="Outgoing" data-param2="1000487874" /> 

을 그리고처럼 액세스 :

을

$("#button1").live("click", function(){ 
     showMessage($(this).attr("data-param1"), $(this).attr("data-param2")); 
    }); 

나는 또한 HTML에 작은 오류가 있음을 발견했습니다. onlick 속성에 추가 끝 점이 하나 더 추가됩니다.

onclick="javascript: showMessage('Outgoing', 1000487874')" 
//should be: 
onclick="javascript: showMessage('Outgoing', 1000487874)" 
//or: 
onclick="javascript: showMessage('Outgoing', '1000487874')" 

Answer 2

전역 범위에서 호출 했으므로 JS 메서드도 동일한 범위에 있어야합니다.

두 가지 옵션이 있습니다.

1. 당신은 너무 동적으로 생성 여부를 여부는 중요하지 않습니다 .live를 사용하여 바인딩 jQuery를 사용할 수 있습니다.

2. $(function(){})의 메서드를 전역 범위로 이동할 수 있습니다.

Answer 3

자바 스크립트 :

label이며, 의미하지 않는다

"이것은 자바 스크립트 코드입니다". 메타 데이터가있는 specify that onclick attributes contain JavaScript입니다.

동적으로 버튼을 만들었 기 때문에 위에서 언급 한 것처럼 호출해야합니다.

이는 잘못된 전제입니다.

jQuery scope $ (function() {}) 내에 정의 된 일반적인 메서드에서이 범위 외부에서 액세스 할 수 없다는 것을 알게되었습니다! 어떻게 해결할 수 있을까요?

이동은 익명 함수 외부의 기능