JQuery Новичок, нужна помощь

Question

Ладно, так что я нахожусь в процессе воссоздания этой функции:

http://www.w3.org/html/logo/#the-technology

я тока есть так, когда вы нажимаете на ссылку, она будет добавить класс изображение, относящееся к этой ссылке (href = "# one" на <a>, а затем id = "# one" на <img>), однако в настоящее время он не проходит через каждый тег <a> и только один. А также не удаляет класс, который я запросил.

код следующим образом:

JS

$(document).ready(function() { 

var container = '#portfolio #text_container'; 

var img_container = '#portfolio #image_container'; 

$(container).children('a').bind('click', function() { 

var this_attr = $(this).attr('href'); 

var this_img = $(img_container).find('img').attr('id'); 

if(this_attr == this_img) { 

    //$(img_container).find('img').hasClass('current').removeClass('current'); 

     // ^^^ This line isn't working, any ideas? :/ 

    $(img_container + ' img[id*="' + this_attr + '"]').addClass('current'); 

} 

else { 

    alert(this_img + ' this img'); 

     alert(this_attr + ' this attr'); 

} 

    }); 

}); 

И HTML выглядит следующим образом

<div id="portfolio"> 

    <div id="image_container"> 
     <img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif" alt="" class="current" id="#one" /> 
     <img src="http://static.jquery.com/files/rocker/images/btn_downloadLarge.gif" alt="" id="#two" /> 
    </div> 

    <div id="text_container"> 
     <a href="#one" class="link">Item 1</a> 
     <a href="#two" class="link">Item 2</a> 

     <p id="#one" class="current">A bunch of text!</p> 
     <p id="#two">The second bunch of text!</p> 
    </div> 

</div> 

Пожалуйста, дайте мне знать, если вам нужно больше информации :)

rcravens fi фиксировано с помощью следующего кода ..

JS

$(document).ready(function() { 


    $('#text_container a').click(function(evt) { 
     evt.preventDefault(); 

     $('.current').removeClass('current'); 

     var href = $(this).attr('href'); 

     $("." + href).addClass('current'); 


    }); 

И HTML ..

<div id="portfolio"> 

    <div id="image_container"> 
     <img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif" alt="" class="one current" /> 
     <img src="http://static.jquery.com/files/rocker/images/btn_downloadLarge.gif" alt="" class="two" /> 
    </div> 

    <div id="text_container"> 
     <a href="one" class="link">Item 1</a> 
     <a href="two" class="link">Item 2</a> 

     <p class="one current">A bunch of text!</p> 
     <p class="two">The second bunch of text!</p> 
    </div> 

</div> 

Answer 1

Моя интерпретация того, что вы пытаетесь сделать здесь:

http://jsfiddle.net/rcravens/wMhEC/

Код изменен. У вас не должно быть нескольких элементов с одним и тем же идентификатором.

Боб

Answer 2

Причина этого не работает:

if(this_attr == this_img) 

потому, что this_attr является URL и this_img является значение атрибута ID.