如何从此Javascript / jQuery函数访问HTML属性？

Question

I have the following

<div id="entries_list">
    <div id="entry_51" class="entry" data-entry_id="51">
        some text
    </div>
</div>

I am making entries_list sortable using jQuery UI . I need to do something when the user 'drops' an entry div, which can be done by:

$("#entries_list").sortable({
    stop: function(event, ui) {
        console.log(ui);
    }
});

What is the easiest way to access the data-entry_id attribute of the entry div from within the stop function? The console ouput of ui looks like this:

Answer 1

尝试

alert(ui.item.attr("data-entry_id"));

Answer 2

ui.item is provided as a jquery object, so you can directly do ui.item.data('data_entry')

$("#entries_list").sortable({
    stop: function(event, ui) {
        console.log( ui.item.data('entry_id') );
    }
});

will put 51 to the console in this example .

demo at http://jsfiddle.net/gaby/jKPty/

Answer 3

Use the .data() function - http://api.jquery.com/data/ . Note that HTML5 "data-" attributes are specified without the leading "data-" (hence, just "entry_id").

ui.item.data("entry_id")