jQueryセレクタで変数を使用できません

Question

私は長い間この問題を解決しようとしてきました。私は何が間違っているのか分かりません。

私はあなたがjQueryのセレクタに変数を使用することができ、それが動作しますが、次のように知っている：

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

だから私はjQueryのlighboxのために、このコードでそれを使用したい：

$(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(); 
    }); 

}); 

基本的に画像でdivをアニメーション化します。しかし、私はこれを動作させることはできません。 'id'変数を数値に置き換えると、それは想定されているように機能しますが、変数は何らかの値を返すようには見えません。

ご協力いただければ幸いです。私はこの1時間で時間を費やしました:)

私は偉大なプログラマーになるための旅の初心者です。

Answer 1

セレクタ".lightbox_content#image_" + idは意味をなさないでしょう。 「id」値の画像がある場合は、"#image_" + idが必要です。あなたが今持っているのは、あなたが探しているidが "lightbox_content"要素自身にある場合にのみ機能します。あなたは "＃"の前にスペースを入れることができますが、（おそらく）無意味です。 （実際のHTMLはそれを確認するに役立つだろう見て。）

しかし、あなたはすでに（両方thisとe.targetで）ターゲットDOM要素への参照を持っているので、あなただけの直接それを使用することができます

$(this).fadeIn(); 

を

Answer 2

まず、クラス名を前に付けてIDセレクタをフィルタリングする必要はありません。パフォーマンスが向上しません。あなたはそれを間違ってやっています。おそらくそれが失敗している理由です。

どちらかが行います。

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

or 

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

を参照してください：あなたのコメントからもhttp://jsfiddle.net/KpUZX/

問題は、IDを取得してあるかもしれない...なぜあなたがしようといけない：

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