0

私はここ数時間、これで壁に頭をぶつけてきました-運がありません。つまり、next()jQueryメソッドから目的の機能を取得できないようです。画像をクリックすると、DOMの次のimgタグが表示されるようにしようとしています。

$(images).each(function(i){

    $('#images').append($(this).css({

        'display':(i) ? 'none' : 'in-line'

    }).click(function(){

        $(this).next().css({'display':'in-line'});

        $(this).css({'display':'none'});

    }));
});

必要な画像は消えますが、「next()」の画像は表示されません。大きなアイデアは何ですか?環境は次のとおりです。

<div id="images">
    <img src="imgs/1.jpg" style="width: 333.33333333333337px; height: 500px; position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -166.66666666666669px; display: none; ">
    <img src="imgs/2.jpg" style="width: 333.3333333333333px; height: 500px; position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -166.66666666666666px; display: none; ">
    <img src="imgs/3.jpg" style="width: 333.3333333333333px; height: 500px; position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -166.66666666666666px; display: none; ">
    <img src="imgs/4.jpg" style="width: 333.3333333333333px; height: 500px; position: absolute; top: 50%; left: 50%; margin-top: -250px; margin-left: -166.66666666666666px; display: none; ">
    <img src="imgs/7.jpg" style="width: 500px; height: 333.3333333333333px; position: absolute; top: 50%; left: 50%; margin-top: -166.66666666666666px; margin-left: -250px; display: none; ">
</div>

これは、これらの要素がjQueryを介して動的に作成されるという事実と関係がありますか?動的に作成された要素の反復は、画像が読み込まれた後にのみ開始されることに注意してください。

ありがとう。

4

1 に答える 1

3

そのinlineではないin-line

$(this).next().css({'display':'inline'});
于 2012-06-18T04:10:18.453 に答える