jQueryがハッシュを取得してIDとして適用する

Question

私の関数はURLにハッシュをチェックし、その値を返し、その値を使って（IDで）画像を見つけ出し、それにクラス名を適用します。私のコンソールにはエラーは表示されませんが、期待した結果が表示されません。代わりに、それはid=image

に.zクラスのすべてを書いています返さhash値で.zクラスをフィルタリングする

は、その値をフィルタリングし、IDとしてそれを使用するための良い方法はありますか？ありがとう！

はJavaScript：

(function($){ 
$.brantley = function(callback) { 
    var $doc = $(document), 
     $win = $(window), 
     $z, $load, $footer, $header, $status, $container, $hash; 

    $doc.ready(function() { 
     $z   = $('.z'); 
     $load  = $('#load'); 
     $footer  = $('footer'); 
     $header  = $('header'); 
     $status  = $('#status'); 
     $container = $('#container'), 
     hash  = gethash(); 

     if(hash) { 
      var image = hash; 
      $('.z').attr('id', 'image').addClass('active'); 
     } else { 
      $('.z:first').addClass('active'); 
     } 

    }); 

    function gethash() { 
     var hash=window.location.hash; 
     hash=hash.replace(/#/,''); 
     return hash; 
    } 

    function updateNumber(type) { 
     window.location = window.location.pathname + "#" + type; 
    } 

}; 
})(jQuery); 

EDIT：あなたはIDによってフィルタリングされていない

(function($){ 
$.brantley = function(callback) { 
    var $doc = $(document), 
     $win = $(window), 
     $z, $load, $footer, $header, $status, $container; 

    $doc.ready(function() { 
     $z   = $('.z'); 
     $load  = $('#load'); 
     $footer  = $('footer'); 
     $header  = $('header'); 
     $status  = $('#status'); 
     $container = $('#container'); 

     var hash = gethash(); 

     if(hash) { 
      $('#' + hash + '.z').addClass('active'); 
     } else { 
      $('.z:first').addClass('active'); 
     } 

     bromance(); 
    }); 

    $win.load(function() { 
     bromance(); 
     $load.fadeOut('fast', function() { 
      $('.active').fadeIn('slow'); 
      $status.fadeIn('slow'); 
      $footer.fadeIn('slow'); 
     }); 
    }); 

    $win.resize(function() { 
     bromance(); 
    }); 

    function gethash() { 
     var hash=window.location.hash; 
     hash=hash.replace(/#/,''); 
     return hash; 
    } 

    function updateNumber(type) { 
     window.location = window.location.pathname + "#" + type; 
    } 
}; 
})(jQuery); 

Answer 1

：

がすべて考慮のコメントだけでなく、答えを取った、ここで私が終わっものですIDを変更しています。

$('.z').attr('id', 'image').addClass('active'); 

選択し、「言う：私はあなたの問題は、このラインだと思う

if(hash) { 
    $('#' + hash + '.z').addClass('active'); 
} else { 
    $('.z:first').addClass('active'); 
} 

Answer 2

：

if(hash) { 
    var image = hash; 
    $('#' + image + '.z').addClass('active'); 
} else { 
    $('.z:first').addClass('active'); 
} 

それとも、その余計な変数を取り除く：IDによってフィルタリングするには、これを使用しますクラス 'z'を持つすべての要素を 'id'属性を文字列 'image'に設定して、 'active'クラスを追加します。

あなたは何をしますか？ 「『アクティブ』変数imageで何のと同じIDを持つ要素を選択して、クラスを追加すると言うどの

$('#' + image).addClass('active'); 

：行うにはtがこれです。

idがある場合は、idがページ内で一意であるため、クラスを選択する必要はありません。あなたはクラスと ID、$('.z#' + image)を持っているセレクタを使用することができますが、ページ上の重複したIDを持っていない限り、それは冗長であり、そしてあなたが場合は、あなたのHTMLが無効であるとあなたが一貫性のある結果を得ることはありません重複したIDを持っています異なるブラウザ間で

EDIT：idがとの場合は、その要素を変更したくない場合は、最後の段落の$('.z#' + image)セレクタを使用します。または$('#' + image + '.z')。