2

私はこのjsfiddleを私の問題で設定しました:http://jsfiddle.net/7MjN6/

ご覧のとおり、2つの画像があります。それぞれがクリックされたときに、それぞれを囲むdivを拡大したいと思います。thisオブジェクトを使用して、画像をクリックするとその画像のdivのみが展開されるようにしようとしていますが、this接続されていないため、間違って使用していると確信しています。誰かが私のフィドルを刺すことができれば幸いです!

HTML:

<body>
    <div class="img-container">
        <a href="#"><img src="http://blueantlabs.com/wp-content/themes/blueantplate/img/port-wide/thefutureproject-605.png" /></a>
    </div>
    <div class="img-container">
        <a href="#"><img src="http://blueantlabs.com/wp-content/themes/blueantplate/img/port-wide/thefutureproject-605.png" /></a>
    </div>
</body>​

JS:

$(function(){
    $('.img-container').each(function(index){
        var imgHeight = $(" a img").height();
        $('a').click(function(e){
            e.preventDefault;
            $('div').animate({height: imgHeight});
        });
    });     
});​
4

2 に答える 2

3

このアプローチを試してください。あなたはまったく必要ありません.each

$(function() {
    $('a').click(function(e) {
        var imgHeight = $(this).find('img').height(); // use "this", find the img inside
        e.preventDefault(); // this is a method, must use parentheses
        $(this).parent().animate({ // "this" is the anchor; move up to the parent
            height: imgHeight
        });
    });
});​

http://jsfiddle.net/mblase75/7MjN6/4/

于 2012-09-11T17:56:40.980 に答える
0

$("div").animate(...)に変更する必要があります$(this).closest("div").animate(...)。イベントハンドラー内ではthis、クリックされたリンクを参照します。すべてのdivを拡張する必要はありません(現在のバージョンでは拡張します)。クリックされたリンクをラップしているdivを展開します。を使用してそこに移動し.closest()ます。

于 2012-09-11T17:54:46.347 に答える