HTML5 / jQuery: Working with custom attributes

Question

Hi I was wondering if someone could give me a hand with how exactly data-* works... I need to create a custom attribute which will be accessed with jquery...

heres what i got so far:

HTML

<select name='province' class='province' data-IsSelectSingle='true'> ... etc ...

jQuery

if($.data("IsSelectSingle") != "true")

and even though its true it executes still... ive also tried...

if($.data($(".province"), "IsSelectSingle") != "true")

Figured I'd try that since thats what it shows as the method on the jquery site but it doesn't seem to work either... any ideas why this might be?

Thanks in advance!

Answer 1

You need to grab the element via its selector ( .province ), and then use .attr or .data to get the data:

$(".province").attr("data-IsSelectSingle") != "true"

or

$(".province").data("IsSelectSingle") != "true"

Note, there are major differences between .attr and .data , and they way they handle HTML5 data attributes. See the docs for reference ( .attr & .data ).

Answer 2

您需要一个数据选择器，以使其知道在哪里查找数据属性。

if($("select.province").data("IsSelectSingle")!="true")