JavaScript onclick 호출에서 데이터를 보내고 클릭 핸들러 함수에 액세스하려면 어떻게해야합니까?

Question

이것은 나를 잠시 동안 붙잡아 두었습니다 ... onclick JavaScript 호출에 관한 웹 검색은 때때로 onClick 및 다른 시간 onclick 에서처럼 대문자 C를 사용합니다. 내 코드는 JQuery Mobile 앱의 일부이지만 onclick은 JS입니다. 그러면 다음과 같이 보입니다.

domEntry = '<li><a href="#poet-details"'; 
domEntry += ' onclick="getPoetDetails('+ poet_name + ')">'; 
domEntry += poet_name; 
domEntry += '</a></li>'; 

div에 추가 할 예정입니다. 'poet_name은 3 행에 올바르게 표시됩니다. getPoetDetails에서 어떻게 액세스합니까? 나는 그것을 올바르게 부른 것인가? 또한 참조하십시오 : http://jsfiddle.net/brucewhealton/XF5AJ/

주어진 링크에서 getPoetDetails 함수를 볼 수 있습니다. 이벤트 객체 변수를 통해 액세스합니까? 응용 프로그램은 쿼리 문자열을 다른 위치 인 dbpedia.org/sparql로 보내고 JSON을 다시 가져옵니다. 시인에 대한 세부 정보를 얻으려면 두 번째 쿼리에 poet_selected 또는 poet_name이 필요합니다. 그 이유는 내 응용 프로그램이 지금까지 시인 만 나열하고 있기 때문입니다.별로 관심이 없습니다. 나는 이것을 알아 내서 DBpedia.org의 "Poets_by_nationality"카테고리에서 사용자가 국적을 선택하도록하여 앱을 시작할 수 있도록하고 싶습니다. 내 문제는 사용자의 선택을 캡처하고, 클릭하거나 JQuery Mobile 앱에서 클릭하여 다른 기능으로 전송하는 것입니다. 감사합니다, 브루스 나는 getPoetDetails에 올바르게 선언 (poet_name_selected) 함수를 귀하의 질문을 이해한다면

Answer 1

그래서 당신이 겪고있는 문제? 이 작업을 수행하는 가장 좋은 방법은 인라인 자바 스크립트가없는 것입니다. 당신이 그것을 할하기로 결정했습니다 그러나 새로운 앵커있을 때마다이, 당신이 준비 창에서 자바 스크립트를 시작하거나 할 때, 당신은이와 #result의 내부보고 jQuery를 알려줍니다

$('#result').delegate('a', 'click', getPoetDetails); 

이 작은 줄을 추가한다 태그는이 클릭 이벤트를 적용합니다. click 이벤트는 getPoetDetails를 호출해야합니다. 당신은이 시인의 이름의 값 앵커에게 이름의 데이터 값을주고있다이

domEntry = '<li><a href="#poet-details"'; 
domEntry += 'data-name="'+ poet_name + '">'; 
domEntry += poet_name; 
domEntry += '</a></li>'; 

이 대신 자바 스크립트 물건을 없애해야하고 작성 및 앵커 태그를 삽입 이제

. 이제 jQuery를 사용하여 getPoetDetails 함수 내에서이 데이터를 가져올 수있다. 그것의 시작은 지금 이것 일 수 있고, 나머지를 동일하게 유지하십시오.

var getPoetDetails = function(){ 
var poet_name_selected = $(this).data('name'); 
// show loader 

나는 당신이 당신의 JSON 데이터를 얻기 위해 호출 할 때 당신도 뭔가 잘못하고있다 확신하거나 잘못 해석되지만, 지금은 적어도 이름은 getPoetDetails 제대로 받고 있습니다. 이것을 jsfiddle에서 작동하는 것으로 표시하려면 onLoad 드롭 다운을 noWrap 본문으로 변경해야합니다. 이미 js에서 문서를 준비했기 때문입니다.

이 정보가 도움이되기를 바랍니다.

Answer 2

의 poet_name 될 것 poet_name_selected. poet_name이 문자열 인 경우

Answer 3

가, 다음은 따옴표로 포장해야합니다

domEntry += ' onclick="getPoetDetails(\''+ poet_name + '\')">'; 

그래서 결과 HTML은 다음과 같이 표시됩니다 또한

onclick="getPoetDetails('Henry Abbey')" 

, 당신은 '더 랩]을 선택해야합니다 '대신 jsfiddle 설정에서'onLoad '를 사용하여 함수 getPoetDetails을 전역으로 만듭니다.

편집 : 여기에 그것을 할 수있는 또 다른 방법이있다 :

domEntry = '<li><a href="#poet-details" class="poet">'; 
domEntry += poet_name; 
domEntry += '</a></li>'; 

그럼 그냥 루프 후 : 시인 이름의 앵커 태그에 대한 온 클릭으로

$('.poet').click(function() { 
    getPoetDetails($(this).text()); 
});