2012-01-02 11 views
1

$(これ)の子孫クラスにどのように追加することができますか?私は

<div> 
<div class='target'></div> 
</div> 

<div> 
<div class='target'></div> 
</div> 



$('div').click(function(){ 
    $('<div>hello</div>').prependTo('.target'); 
}); 

答えて

3

のみハンドラ内thisを使用する(だけでなく、下記を参照してください、その後、関連するdivをフック...実際にはこの例ではクリックされていますdivの前に追加したい、私はあなたの質問を読むことができる2つの異なる方法):イベントハンドラ内

$('div.target').click(function(){ 
    $('<div>hello</div>').prependTo(this); 
}); 

はjQueryを介して、フックアップ、thisは、あなたがそれにハンドラがイベントを受信夢中特定のDOM要素を指します。詳細については、bindまたはonのドキュメントを参照してください。

Live example(あなたはまた、最後に})は、構文エラーを引き起こし、逆転していた。)

あなたの目標は、ターゲットのdivの前でのdivプリペンド上の任意の場所をクリックを持っているのであれば、それはより多くのこのようなものだ:

$('div').click(function(){ 
    // Look for "target" divs within this div 
    var target = $(this).find("div.target"); 

    // Did we find any? 
    if (target[0]) { 
    // Yes, prepend to it/them 
    $('<div>hello</div>').prependTo(target); 

    // And stop the event 
    return false; 
    } 
}); 

Live exampleあり、我々は再びthisを使用しているが、今回はdivイベントはが含まれているために伝播したかどうかを確認するためにそれを使用していますは "target"クラスです。その場合は、「hello」divの先頭に「return false;」と入力してください(代わりにevent.stopPropagation();を使用してください)。

+0

閉じ括弧 "}}"が逆転しているため、動作しません。 –

+0

@ dku.rajkumar:私はそれを指摘しました。 –

+0

cooooooool ...... –

0
$('div.target').click(function(){ 
    $('<div>hello</div>').prependTo($(this)); 
}); 

角カッコで間違いがあります。

$('div.target').click(function(){ 
    $(this).prepend('<div>hello</div>'); 
}); 

更新:あなたはクリックを追加する必要がありますあなたはまず、これまでのようなものをこれとプリペンドを選択することができ、またhttp://jsfiddle.net/8SrAW/

1

:あなたはそれが})

フィドルする必要があり、)}を与えていますターゲットにすべてのdivに代わって、またはダブルイベントがあります。