jQuery가 해시를 검색하여 ID로 적용합니다.

Question

내 함수는 URL에 해시가 있는지 확인하고 값을 반환하고 해당 값을 사용하여 ID로 이미지를 찾고 클래스 이름을 적용합니다. 내 콘솔에 오류가 표시되지 않지만 예상 된 결과가 표시되지 않습니다. 대신, id=image

에 .z 클래스의 모든를 쓰고 반환 hash 값으로 .z 클래스를 필터링

는 그 값을 필터링하고 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에 의해 필터링되지 않습니다 EDIT

(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); 

: 여기에 내가 완료 무엇

모두 고려하여 의견뿐만 아니라 답을 툭 것 ID를 변경하고 있습니다.

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

을 아니면 그냥 불필요한 변수를 제거하기 : ID를 기준으로 필터링하려면 다음을 사용하여 문제가이 라인

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

Answer 2

내 생각 :

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

말한다 "를 선택 클래스 'z'가있는 모든 요소를 ​​'id'속성을 문자열 'image'로 설정 한 다음 '활성'클래스를 추가하십시오.

할 수 t은 이것이다 :

변수 image에서 어떤의와 동일한 ID를 가진 요소를 선택하고 클래스 '활성'추가 "라는

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

.

참고 ID가있는 경우 ID는 페이지에서 고유해야하기 때문에 클래스를 선택할 필요가 없습니다. 당신 은 클래스 및 아이디, $('.z#' + image)이있는 선택기를 사용할 수 있지만 페이지에 중복 ID를하지 않는 한이 중복이며, 당신이 경우은 HTML이 유효하고 일관된 결과를 얻을 수 없습니다 중복 ID를 가지고 다른 브라우저에서.

EDIT : 해당 id가 및 인 z를 제외하고 요소를 변경하지 않으려면 z 클래스에 마지막 단락의 $('.z#' + image) 선택기를 사용하십시오. 또는 $('#' + image + '.z').