jQuery를 사용하여 데이터 ID 선택

Question

jQuery 사용 사용자가 단추 중 하나를 클릭 할 때 라디오 단추에서 데이터 등급을 선택할 수있게하려면?

<label class="ratingStar"><input type="radio" name="spotRating" id="_1of5" data-rating="1" data-spot-id="1" class="rating-system" /></label> 
<label class="ratingStar"><input type="radio" name="spotRating" id="_1of5" data-rating="2" data-spot-id="2" class="rating-system" /></label> 

나는 다음과 같은

$(".ratingStar").on("click", function(){ 

    selected_rating = $('input', $this).data("rating"); 
    selected_id = $('input', $this).data("id"); 


    console.log(selected_rating) 

}); 

Answer 1

이 시도하려고 한 요소에는 ID가 그래서 난 당신이

$(".ratingStar").on("click", function(){ 
    selected_rating = $('input', this).data("rating"); 
    selected_id = $('input', this).data("spot-id"); //Changed to spot-id 


    console.log(selected_rating) 

}); 

Answer 2

아래의 작동 데이터 자리-ID를 의미 짐작이 있었다 :

$(".ratingStar").on("click", function() { 
    selected_rating = $('input', $(this)).data("rating"); 
    selected_id = $('input', $(this)).data("spot-id"); 
    console.log(selected_rating) 
}); 

EDIT 1 :$this을 this 또는 $(this)으로 수정하면 실제로는 data("id")으로 작동합니다.

예를 들어, 아래가 작동합니다. 데모를 보려면 here을 클릭하십시오. 안토니 제분 용 곡물의 코멘트를 인용 :

$(".ratingStar").on("click", function() { 
    selected_rating = $('input', this).data("rating"); 
    selected_id = $('input', this).data("id"); // data("spot-id") also works 
    console.log(selected_rating) 
}); 

편집 2.

컨텍스트 (번째 인수 해당 할 수있다) 중 하나 DOM 요소 또는 의 jQuery 오브젝트. this은 DOM 요소이므로 $('input', this)을 직접 전달할 수 있습니다. $(this)을하는 것은 jQuery를 함수를 호출하고, 생성 새로운 jQuery를 목적 단순히이 포함 - 당신이 (이 잘 작동 통과) 그렇게 필요하지 않기 때문에 당신이 그렇게

일을 피해야에 기반 위의 대답은 EDIT 1 아래에있는 것이 좋습니다.

Answer 3

.attr() method을 사용하여 속성을 참조하여 데이터에 액세스 할 수 있습니다.

$(".ratingStar").on("click", function(){ 
    selected_rating = $('input', $this).attr("data-rating"); 
    selected_id = $('input', $this).attr("data-spot-id"); 
    console.log(selected_rating); 
});