jQuery-camel-case-mapping von "data-" Attribut-Namen ".data ()" - Tasten

Wenn du eine "Daten -" - Attribut auf ein element:

<div id='x' data-key='value'>

dann können Sie den Wert über die jQuery -".data ()" - Methode:

alert($('#x').data('key')); //alerts "value"

Die Bibliothek verwendet ein einheitliches camel-case-Konverter für Attribut-Namen mit embedded-Strichen:

<div id='x' data-hello-world="hi">

alert($('#x').data("helloWorld"));

Die camel-case-Konverter ist ein jQuery - "global" - Funktion:

alert($.camelCase("hello-world")); //alerts "helloWorld"

Doch dies alles bricht zusammen, wenn das Attribut name ein name mit einem Buchstaben, umgeben von Bindestrichen:

<div id='x' data-image-x-offset='50px'>

alert($('#x').data('imageXOffset')); //undefined

Das ist ein bisschen komisch, weil:

alert($.camelCase('image-x-offset')); //"imageXOffset"

Also, was ist falsch? Ich denke es hat etwas zu tun mit dem Mechanismus verwendet, um zu gehen die anderen Richtung, die Umwandlung einer bereits die camel-case-name zurück in die gestrichelte form. Ich kann nicht lokalisieren, es in den code jedoch.

Scheint das gleiche zu sein, die in 1.6.2 wie in 1.6.3. (Die form "Bild-x-offset" kann verwendet werden, um die Daten zu erhalten, übrigens.)

Bearbeiten — wenn für ein bestimmtes element, Sie über die gestrichelte form vor Versuch, die camel-case-form, dann klappt es (und das sagt mir, dass dies definitiv eine bug 🙂

  • jQuery-bug-report hier: bugs.jquery.com/ticket/10194 (eingereicht von @Pointy)
  • jsFiddle für Sie: jsfiddle.net/hJDLY/1 . Ordentlich, wie es aussieht ist die OP gemacht, die bug-report! 😛
  • Vielen Dank an alle! Dieser aß mein morgen :/
  • Schauen Sie auf der hellen Seite, Sie sind ein Beitrag zu jQuery! Es ist seltsam, Blick auf die Quelle gibt es keine sofort offensichtlichen Grund, warum dies der Fall ist. Es empfängt/setzt den zwischengespeicherten Wert mit der gleichen camelCase-Funktion. github.com/jquery/jquery/blob/1.6.2/src/data.js
  • Sie können auch einfach gehen $('#x').data('image-x-offset') und Sie erhalten die Daten. Es ist nicht verpflichtend zu verwenden, die camelCaps es scheint. Wie es aussieht ist fest in jQuery 1.7 so schöne Arbeit trotzdem.
InformationsquelleAutor Pointy | 2011-09-02
  1. 14

    Du hast Recht. Das Problem scheint zu sein, mit der regex verwenden Sie für die Konvertierung von camelCase zu zerschlagen.

    rmultiDash = /([a-z])([A-Z])/g;

    ...hier:

    var name = "data-" + key.replace( rmultiDash, "$1-$2" ).toLowerCase();

    ...die Ergebnisse:

    data-image-xoffset

    ...statt:

    data-image-x-offset

    Demo: http://jsfiddle.net/TLnaW/

    So, wenn Sie die gestrichelte version, wenn es so aussieht, für ein Attribut, findet er es mit keine Notwendigkeit für eine Umstellung, und fügt dann die camelCase-version auf die Elemente der Daten in jQuery.cache.

    Nachfolgenden versuche wird dann funktionieren, weil die richtige camelCase ist jetzt dort, so dass es nicht mehr versuche, um es als Attribut, und daher nicht mehr benötigt, die fehlerhafte regex.

    • Ich starrte Sie an, daß, wenn ich sah es früher, aber ich gepatzt, wenn Sie versuchen, um herauszufinden, genau das, was es tun würde, durrr -- danke!!
    InformationsquelleAutor user113716
Schreibe einen Kommentar