JQuery와 1.6.2 이상한 행동 데이터는 attrbiute와

Question

나는이 HTML 자바 스크립트를 통해 동적으로 생성 한 :

<div class="blue-button-bg task-status" data-id="2" data-TaskId="2"> 
Scheduled 
</div> 

JQUERY : 내가 클릭 이벤트에 alert($(this).prop("data-id"))을 쓸 때

$(".task-status").live("click", function() { 

    alert("data-id using prop: " + $(this).prop("data-id")) 
    alert("data-id using data: " + $(this).data("id")) 

    alert("data-TaskId using prop: " + $(this).prop("data-TaskId")) 
    alert("data-TaskId using data: " + $(this).data("TaskId")) 

}); 

그것이 정의되지 않은 그러나 때 이 alert($(this).data("id"))"2" 예상대로 수행하십시오.

내가 그것을 prop() 및 data() 모두 정의되지 않은을 반환 data-iddata-TaskId에 속성을 변경하는 경우.

누구나 설명 할 수 있습니까?

FIDDLE DEMONSTRATING PROBLEM

Answer 1

귀하의 data-* 속성은 DOM 요소 속성에 할당되지 않습니다.

사용 attr()보다는 prop() :

alert("data-id using prop: " + $(this).attr("data-id")) 
alert("data-id using data: " + $(this).data("id")) 

alert("data-TaskId using prop: " + $(this).attr("data-TaskId")) 
alert("data-TaskId using data: " + $(this).data("TaskId")) 

귀하의 data-TaskId 데이터 속성은 소문자로 변환됩니다. .data().taskId

JSFiddle

Answer 2

HTML5 데이터 속성은 소문자 여야 낙타 경우

http://www.sitepoint.com/use-html5-data-attributes/

속성로드 할 수 없습니다 : 대문자 만 hypenated가 data-task-id하는 낙타 맡았다 속성을 속성을 변환하는 jQuery의 .data() API에 의해 사용됩니다

또한 $ ("selector")를 사용할 수 있습니다. 데이터 ("데이터가없는 낮은 가격")

Answer 3

전자 대신 attr 메서드를 사용합니다. .

$ (". 태스크 상태") 살() (, {

alert("data-id using prop: " + $(this).attr("data-id")) 
alert("data-id using data: " + $(this).data("id")) 

alert("data-TaskId using prop: " + $(this).attr("data-TaskId")) 
alert("data-TaskId using data: " + $(this).data("TaskId")) 

을} 기능을 "클릭");

Answer 4

YOUR UPDATED FIDDLE :

시도 .attr() 오히려 .prop()를 사용하여. 둘째로 TaskId은 lowercase으로 작성해야합니다. 아래 참조 : -