0

私はここで同様の問題を抱えていました: 私が解決した特定のクラスのjQuery関数 。しかし、div が多すぎて見栄えがよくないので、私は悩まされたので、HTML コードを書き直し、セレクター スクリプトを書き直しました。これで、スクリプトは画像を正常に読み込みます (すべてフェードインします) が、選択はまったく機能しません。私は最も近い関数と兄弟関数を使用しようとしましたが、役に立ちませんでした。

どうすればこれを解決できますか? 問題のページは http://baldino.rs/baby-program/にあります。

事前にサンクス

$(document).ready(function(){

var picture = $('.post-cipela').each(function(index, element) {
$(this).find('.cipela-bg img:eq(0)').fadeIn(500);

$('.colorwrap a').click(function(){
  var index = $(this).find(".colorwrap a").index(this);
    $('.cipela-bg img').fadeOut(200);
    $('.cipela-bg img:eq('+index+')').fadeIn(500);
    });
});

EDIT-1: スクリプトを修正しました。画像が複数回フェードインするため、問題が発生しました。どうすれば修正できますか？- これが修正されたスクリプトで、問題を確認できるページは次のとおりです: http://baldino.rs/baby-program

$(document).ready
(
function()
{
$(".cipela-1").fadeIn(200);
$(".colorwrap a").click
(
    function()
    {
        var item = $(this);
        var a = item.attr("rel");
        item.closest(".post-cipela").find(".cipela-1, .cipela-2, .cipela-3, .cipela-
        4").fadeOut(200);
        item.closest(".post-cipela").find("."+a).first().fadeIn(200);

    }
);
} 
);
4

1 に答える 1

1

貼り付けたコードが悪意のあるもの});であり、最後に余分なものがあります。

さらに、.each関数ループ内に $('.colorwrap a') セレクターをラップしていますが、それを意図しているかどうかはわかりません。

さらに、この変数のスコープを少し見逃しています。

あなたの中のこの行eachは問題ありません。

$(this).find('.cipela-bg img:eq(0)').fadeIn(500);

しかし、クリックハンドラをインスタンス化します

$('.colorwrap a').click(function(){
  var index = $(this).find(".colorwrap a").index(this);

そのハンドラ内の $(this) は、 内で一致したものを参照しaます.colorwrap。次に、その下にある別のインスタンスを見つけています.colorwrap aが、おそらく存在しないため、セレクターは何も見つかりません。

.each 反復ごとにこのクリック ハンドラーをラップするつもりなら$(this)、ループ内で変数に代入し、次のようにクリック ハンドラー内で使用する必要があります。

var picture = $('.post-cipela').each(function(index, element) {
    var that =$(this);
    that.find('.cipela-bg img:eq(0)').fadeIn(500);

    $('.colorwrap a').click(function(){
        var index = that.find(".colorwrap a").index(this);
        $('.cipela-bg img').fadeOut(200);
        $('.cipela-bg img:eq('+index+')').fadeIn(500);
    });
});
于 2012-05-11T00:50:53.527 に答える