2009-04-23 13 views
10

Podczas tworzenia przeglądarek FF3 i IE6/7 z jQuery, czy są jakieś problemy ze zgodnością podczas ustawiania atrybutów niestandardowych na znacznikach HTML?Czy mogę przechowywać niestandardowe atrybuty w HTML DOM jak rekord bazy danych?

Po pierwsze, zdaję sobie sprawę z funkcji jQuery's data() i zasadniczo robi to, co chcę, ale dane nie zachowują funkcji clone(). Jest to problem podczas używania wtyczek jQuery UI draggable/droppable, ponieważ klonuje elementy DOM podczas przeciągania/upuszczania. Na potrzeby tego pytania potrzebuję alternatywy dla data().

Chcę utrwalić dane między operacjami przeciągania/upuszczania. Chcę móc wstrzykiwać dane do elementu DOM, który jest przenoszony podczas operacji przeciągania/upuszczania. Aby to zrobić, mogę zbudować elementy potomne HTML, aby symulować rekord bazy danych. Szybkie eksperymentowanie pokazuje, że Firefox nie ma problemów z wykorzystaniem nazw atrybutów, które chcę przechowywać pola danych. Jednak specyfikacja HTML 4 mówi, że niektóre znaczniki mogą zawierać tylko określone nazwy atrybutów. Czy zapełnianie DOM niestandardowymi atrybutami powoduje problemy z niezgodnością z wymienionymi przeglądarkami?

Odpowiedz

10

Spójrz na to podobne pytanie zadałem z powrotem: Can I just make up attributes on my HTML tags?

Osobiście nie podoba mi się sugerowana odpowiedź na umieszczenie wszystkich danych w atrybucie klasy. Czujesz, po prostu ... źle wiesz? Z mojego doświadczenia wynika, że ​​pomimo tego, że twoja strona nie będzie poprawna, po prostu robię to. Przetestuj to w 4 głównych przeglądarkach i jeśli to działa, kogo to obchodzi?

Najlepsze rozwiązanie, które mogę wymyślić, to takie, które nie jest ważne teraz, ale będzie w HTML5, więc to dobrze. Jak sugeruje ms2ger w tym drugim pytaniu prefiks niestandardowe atrybuty z data-

http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#embedding-custom-non-visible-data

1

Nieobecne jakiś standardowy sposób, aby to zrobić w HTML4, chciałbym mieć pokusę, aby utworzyć ukryty element, który odpowiada moim przeciągać i sklepu powiązane z nim dane. Nazwij ukryty element względem przeciągania, aby łatwo wyszukać informacje na jego temat. Poniższe rozszerzenie implementuje to za pomocą ukrytej rozpiętości. Uwaga: podczas testowania nie mogłem replikować twoich problemów za pomocą przeciągalnych elementów - data() wydawała się działać dobrze dla mnie, ale nie testowałem go z różnymi wtyczkami, tylko UI.Draggable.

Zastosowanie:

$('#draggableDiv').externalData('key','data'); 
var d = $('#draggableDiv').externalData('key'); 

jQuery.fn.externalData = function(key, data) { 
    var value = this; 
    this.each(function() { 
     var id = this.id+'_external_data'; 
     var elem = jQuery('#'+id+':first'); 
     if (elem.size() == 0) { 
      elem = $('<span style="display: none;" id="' + id + '"></span>"'); 
      elem.appendTo(document.body); 
     } 
     if (data) { 
      elem.data(key,data); 
     } 
     else { 
      value = elem.data(key); 
      return false; 
     } 
    }); 
    return value; 
}; 
1

Jest to stosunkowo mało znany, ale dość Dang przydatne: jQuery Metadata Plugin. Pozwoli to na przechowywanie danych w nazwach klas do pobierania. Jest najczęściej używany do sprawdzania poprawności wtyczki, ale naprawdę można go dostosować do dowolnego scenariusza.

Powodzenia z tym, nad czym pracujesz.

Powiązane problemy