2012-04-15 7 views
0

Ich habe versucht, dieses Problem seit langer Zeit zu lösen. Ich habe keine Ahnung, was ich falsch gemacht habe.Eine Variable in einem jQuery-Selektor kann nicht verwendet werden

Ich weiß, dass Sie eine Variable in der Auswahl jQuery verwenden können, und es funktioniert, wie folgt aus:

var dude = "_world"; 
$("#hello" + dude).hide(); 

Also wollte ich es in diesem Code für eine jQuery Lighbox verwenden:

$(document).ready(
function() 
{ 
    $('.gallery_image_preview').click(
    function(e) 
    { 
     id = e.target.id; 
     $('#lightbox_background').fadeIn(); 

     $(".lightbox_content#image_" + id).fadeIn(); 

    }); 

    $('.lightbox_content').find('.lightbox_close').click(
    function() 
    { 
     $('#lightbox_background, .lightbox_content').fadeOut(); 
    }); 

}); 

Was im Grunde ein Div mit einem Bild animiert. Allerdings kann ich das nicht zur Arbeit bringen. Wenn ich die 'id' Variable durch eine Zahl ersetze, funktioniert es wie es soll, aber die Variable scheint irgendwie keinen Wert zurückzugeben.

Jede Hilfe würde geschätzt. Ich verbrachte Stunden auf diesem einen :)

Bitte denken Sie daran, dass ich ein Anfänger auf einer Reise bin, ein großer Programmierer zu werden.

+2

Was tut Ihr HTML sieht aus wie? Und du erkennst, dass du ein extra Führzitat '' 'in deinem geposteten jQuery hast, bevor die' $ '? –

+0

' id' Attribute, die mit einer Zahl beginnen, ungültig sind und Fehler verursachen. Versuche, die ID so zu ändern, dass sie mit AZ beginnt 'Charakter –

+0

es gibt keine Notwendigkeit, für ID-Selektoren zu filtern, es wird die Leistung nicht verbessern – Baz1nga

Antwort

2

Der Selektor ".lightbox_content#image_" + id wird nie Sinn ergeben. Wenn Sie Bilder mit "ID" -Werten haben, brauchen Sie nur "#image_" + id. Was Sie jetzt haben, funktioniert nur, wenn das Element "lightbox_content" selbst die gesuchte ID hat. Sie könnten ein Leerzeichen vor das "#" setzen, aber es ist (wahrscheinlich) sinnlos. (. Ihre tatsächliche HTML Sehen würde dazu beitragen, dass bestätigen)

Da jedoch haben Sie bereits einen Verweis auf das Ziel DOM-Element bekam (beide in this und e.target), können Sie nur das direkt verwenden:

$(this).fadeIn(); 
+0

Trotzdem kann "#image_" + id + ".lightbox_content" 'funktionieren. – kirilloid

+0

Danke, Ich habe versucht, mit $ ("# image_" + id), aber es hat nicht funktioniert. Wenn ich jedoch $ ("# image _" + 5) verwende, funktioniert es plötzlich. "Das" würde nicht funktionieren, weil ich das Wort "image_" brauche, um da zu sein. – Revangelis

+0

Nun, was genau sind Ihre "ID" -Werte? Wenn Sie den HTML-Code nicht veröffentlichen, können wir nicht helfen. @kirilloid Ja, es könnte, aber wir wissen nicht viel über das Markup. – Pointy

0

Zunächst müssen Sie Ihre ID-Selektoren nicht filtern, indem Sie den Klassennamen vor dem Namen voranstellen, da dies die Leistung nicht verbessert. Sie tun es auch falsch und wahrscheinlich ist das der Grund, warum es versagt.

entweder tun:

$("#image_" + id).fadeIn(); // the correct way 

or 

$(".lightbox_content #image_" + id).fadeIn(); //which will work but is useless prepending the class selector 

siehe: http://jsfiddle.net/KpUZX/

Auch aus Ihre Kommentare das Problem mit dem Abrufen der ID sein könnte .. warum nicht Sie versuchen:

id = $(this).attr("id"); 
Verwandte Themen