Bir dizi jQuery .data () özniteliğine nasıl iletilir


86

Tamam, bu yüzden çok basit bir diziyi bir jquery verisine attrubute sunucu tarafına geçirmek istiyorum

<div data-stuff="['a','b','c']"></div>

ve sonra şu şekilde geri çekilin:

var stuff = $('div').data('stuff');

alert(stuff[0]);

Bu neden "a" değil "[" uyarısı veriyor gibi görünüyor (JSfiddle bağlantısına bakın)

JSFiddle Bağlantısı: http://jsfiddle.net/ktw4v/3/

Yanıtlar:


145

Değişkeninize sıfırıncı öğesi olan bir dize olarak davranıyor [ .

Bunun nedeni, dizenizin geçerli JSON olmaması ve tek tırnak yerine dize sınırlayıcı olarak çift tırnak kullanması gerekir. Daha sonra tüm özellik değerini sınırlandırmak için tek tırnak kullanmanız gerekir.

Tırnak işaretlerinizi düzeltirseniz, orijinal kodunuz çalışır (bkz. Http://jsfiddle.net/ktw4v/12/ )

<div data-stuff='["a","b","c"]'> </div>

var stuff = $('div').data('stuff');

JQuery bir veri özniteliğinde geçerli JSON gördüğünde , sizin için otomatik olarak paketini açacaktır .


5
infact, ['a', 'b', 'c'] geçerli bir JSON DEĞİLDİR;)
stecb

2
['a', 'b', 'c'] geçerli değil JSON
Mutt

JSON nasıl görünmeli?
wilsonpage

5
Çift tırnak kullanmalıdır, ancak daha sonra HTML özelliğini kapatmak için tek tırnak kullanmanız gerekir.
Alnitak

1
@JoeBrockhaus, her ikisi de sınırlayıcıdır - tırnak işaretleri "dize sınırlayıcılardır" ve virgüller "kayıt sınırlayıcılardır". Yalnızca ilki, OP'nin sorusu ile ilgilidir.
Alnitak

15

Bir öznitelik olarak bildirmek, onun bir dizge olduğu anlamına gelir.

Yani stuff[0]şuna eşdeğer olacaktır:var myString = "['a','b','c']"; alert(myString[0]);

Bunun gibi görünmesini sağlamalısın:

<div data-stuff="a,b,c"></div>

var stuff = $('div').data('stuff').split(',');
alert(stuff[0]);

Geri çekme: jQuery'nin ayrıştırması, parseJSON kurallarına uymadığı için başarısız olur.

Ancak, çözümümün arkasında duracağım. Diğerlerinin idealden daha az yönleri vardır, tıpkı bu çözümün bazı açılardan idealden daha az olması gibi. Hepsi paradigmalarınızın ne olduğuna bağlıdır.


4
hayır, geçersiz JSON olarak bildirilmesi, bir dize olarak değerlendirildiği anlamına gelir.
Alnitak

@Alnitak - Her ne kadar jQuery'nin bunu ele alma şekli bu olsa da - jQuery Api referansında bunu göremiyorum ve kesinlikle w3c spesifikasyonunda net değil. JSON'u bir dom nesnesinde tanımlamak w3c'nin 'tarafsızlığını' bozacağından, bu bir jQuery uzantısı gibi görünüyor veya dokümantasyon eksikliği göz önüne alındığında - tuhaflık. Her halükarda, bu noktada sizinle aynı fikirde olduğumu söyleyemesem de - aldığınız o ilk + 1'i kaldıracağım için o kadar kızmadım. :)
John Green

O @John olan jQuery API belgelenen - "Her girişim, aksi takdirde bir dize olarak bırakılır bir JavaScript değere (bu Boolean, sayılar, nesneler, diziler ve null adlı içerir) dize dönüştürmek için yapılır."
Alnitak

@Alnitak O zaman kafam iyi çünkü hemen hemen tüm veri bölümünü ve yorumların çoğunu göndermeden önce okudum. Tekrar baktım bile.
John Green

@Alnitak tamam, düzenlemenizden buldum. Evet, bu bir Jquery uzantısıdır. Gönderimi düzelteceğim.
John Green

-2

Başkalarının belirlediği gibi, değer dize olarak değerlendirilir ve bu nedenle "[" döndürür. Lütfen şunu deneyin (aaa div'in adıdır ve data-stuff'ı çıkardım):

$(function(){
    $.data($("#aaa")[0],"stuff",{"aa":['a','b','c']});
    var stuff = $.data($("#aaa")[0],"stuff").aa;
    alert(stuff[0]); //returns "a"
});

-3

Jsfiddle'da farklı bir yaklaşım yayınlanmıştır ; var stuff = $('div').data('stuff');şeyler, 0'ıncı karakteri '[' olarak içeren bir dizedir.

Pekala, var stuff = eval($('div').data('stuff'));sana bir dizi almalıyım


3
eval kötüdür :) her zaman daha iyi bir yol vardır
BYTE RIDER

Lütfen cevabınızı, olası bir çözüm olmasına rağmen eval () tek boynuzlu atların ölmesine neden olabileceğini söyleyecek şekilde ayarlayın ... stackoverflow.com/questions/86513/…
Just Plain High
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.