From 8c318bf41412d493604beed1879c4a273ff05a57 Mon Sep 17 00:00:00 2001 From: Alexis Abril Date: Sun, 10 Apr 2011 15:17:00 -0400 Subject: [PATCH] Fixes #7328. When getting data- attributes, after-cap any embedded dashes per the W3C HTML5 spec. --- src/data.js | 12 ++++++++---- test/unit/data.js | 19 ++++++++++++++++++- 2 files changed, 26 insertions(+), 5 deletions(-) diff --git a/src/data.js b/src/data.js index 2d53a710..c2fd558f 100644 --- a/src/data.js +++ b/src/data.js @@ -1,6 +1,7 @@ (function( jQuery ) { -var rbrace = /^(?:\{.*\}|\[.*\])$/; +var rbrace = /^(?:\{.*\}|\[.*\])$/, + rmultiDash = /([a-z])([A-Z])/g; jQuery.extend({ cache: {}, @@ -223,12 +224,13 @@ jQuery.fn.extend({ data = jQuery.data( this[0] ); if ( this[0].nodeType === 1 ) { - var attr = this[0].attributes, name; + var attr = this[0].attributes, name; for ( var i = 0, l = attr.length; i < l; i++ ) { name = attr[i].name; if ( name.indexOf( "data-" ) === 0 ) { - name = name.substr( 5 ); + name = jQuery.camelCase( name.substring(5) ); + dataAttr( this[0], name, data[ name ] ); } } @@ -282,7 +284,9 @@ function dataAttr( elem, key, data ) { // If nothing was found internally, try to fetch any // data from the HTML5 data-* attribute if ( data === undefined && elem.nodeType === 1 ) { - data = elem.getAttribute( "data-" + key ); + name = "data-" + key.replace( rmultiDash, "$1-$2" ).toLowerCase(); + + data = elem.getAttribute( name ); if ( typeof data === "string" ) { try { diff --git a/test/unit/data.js b/test/unit/data.js index 8fb7f35a..94fa2a01 100644 --- a/test/unit/data.js +++ b/test/unit/data.js @@ -485,4 +485,21 @@ if (window.JSON && window.JSON.stringify) { equals( JSON.stringify(obj), '{"foo":"bar"}', "Expando is hidden from JSON.stringify" ); }); -} \ No newline at end of file +} + +test("jQuery.data should follow html5 specification regarding camel casing", function() { + expect(6); + + var div = jQuery("
") + .prependTo("body"); + + equals(div.data().foo, "a", "Verify single word data-* key"); + equals(div.data().fooBar, "b", "Verify multiple word data-* key"); + equals(div.data().fooBarBaz, "c", "Verify multiple word data-* key"); + + equals(div.data("foo"), "a", "Verify single word data-* key"); + equals(div.data("fooBar"), "b", "Verify multiple word data-* key"); + equals(div.data("fooBarBaz"), "c", "Verify multiple word data-* key"); + + div.remove(); +}); \ No newline at end of file