How to get “data” attribute in ie 7?

Question

I use "data" attribute and in IE7 and I don't know how to get value of it. Can jQuery possibly help me?

I have this

window.event.srcElement.getAttribute('data-pk')

Of course it does not work.

Edit:

for (i=0; i < max; i++) {

    if (typeof attachEvent == 'undefined'){         
        //open[i].addEventListener('click', function(e){ openSlide(e.currentTarget.getAttribute('data-pk')), false});
        open[i].onclick = function(e){ openSlide(e.currentTarget.getAttribute('data-pk')), false};
    } else {
        open[i].attachEvent('onclick', function(){
            openSlide(window.event.srcElement.getAttribute('data-pk'))}, false);
    };
};

html

<div>                             
    <img class='image' data-pk='18' src='/site_media/media/img/120x180.jpg'>                             
    <img class='image' data-pk='13' src='/site_media/media/img/007b-300x224.jpg'>                             
    <img class='image' data-pk='15' src='/site_media/media/img/IMG_0549_1.jpg'>                             
</div> 

Answer 1

jQuery can help ... the data attribute works with the data() function in jQuery.

$(srcElement).data('pk');

You can use it with any data attribute, for example, if you had:

<div id="DivId" data-something="foo" data-somethingElse="bar">

You can get the data out by:

$('#DivId').data('something');
$('#DivId').data('somethingElse');

To set data:

$('#DivId').data('something', 'foo');
$('#DivId').data('somethingElse', 'bar');

Here is a link to jQuery .data()

EDIT:

I think you want:

$('.image').click(function () {
    openSlide($(this).data('pk'), false);
});

Answer 2

The top answer is outdated. Given the example <div id="DivId" data-somethingElse="bar"></div>, you will have to do $('#DivId').data('somethingelse') to get the data. The better standard way is to use snake case in HTML, which will yield camelcase in JavaScript:

HTML:

<div id="foo" data-something-else="bar"></div>

JS:

alert($('#foo').data('somethingElse')); // Alerts "bar"

Answer 3

You can use jQuerys (or other libs) attr getter. Or you can look into jQuery source and find out how they achieved cross-browser consistency.

Answer 4

In jQuery you can use the data method, like this:

$(srcElement).data('pk');

Note that the string to pass into data is just 'pk', you simply drop the 'data-' part of the attribute.