html을 추가하려하지만 "하위"를 추가하려면 "장르"를 지우는 기능을 계속합니다.

Question

.append를 사용하여 페이지에 동적으로 삽입 된 태그에 두 번째 수준 (이동 경로)을 추가하려고합니다.

다음은 현재 동작입니다. 메뉴에서 장르를 클릭하면 책이 동적 div에 나타납니다. 그런 다음 "recommended in"다음에 레벨 1 스팬 + 장르 이름이 표시됩니다.

나는 하위 장르를 클릭

는 장르가 완전히 제거되고 하위 장르 난 그냥지고 있어요 "/ 하위 장르 장르에서 권장"

보는 그래서 대신 "/"

에 추가 "에서 추천/Subgenre"

나는이 기능의 무언가가 그것을 닦아 것 같아요. 네가 나에게 줄 수있는 어떤 힌트라도 좋을거야.

$("#genreList a").click(function(event){ 
    $("#genreList a").removeClass('current'); 
    $(this).addClass('current'); 
    event.preventDefault(); 
    var self = $(this); 

    if (self.attr('data-link') !== undefined) { 
     slideGenreList(self.attr('data-link'), self.attr('data-title'), $('#' + self.attr('data-link'))); 
    } 

    // Draw and display the selected genre or the regular page if all genres is selected 
    if (self.attr('data-link') == 'all_genres') { 
     $('#genreContainer .dynamic').hide(); 
     $('#genreContainer .default').fadeIn(); 
     //$('.breadcrumb').html('Genres'); 

    } 
    else { 
     $('#genreContainer .default').hide(); 
     $('#genreContainer .dynamic').html('<h3 class="no-margin-top breadcrumb">Recommended in' + ' <a href="' + self.attr('href') + '" class="button right">See All</a></h3><div class="genre no-margin-top" data-context="/genreList/' + self.attr('data-genreId') + '"></div>').fadeIn(); 
     if (self.parents('ul#all_genres').length > 0) { 
       $('.breadcrumb .level1').remove(); 
       $('.breadcrumb').append('<span class="level1 black"> ' + self.attr('data-title') + '</span>'); 
      } else { 
       $('.breadcrumb .level2').remove(); 
       $('.breadcrumb').append('<span class="level2 black">/' + self.attr('data-title') + '</span>'); 
      } 

     // Rig any genre displays 
     $('#genreContainer .dynamic').find(".genre").each(function(){ 
      new Genre(this); 
     }); 
    } 

}); 

Answer 1

.html()은 div의 모든 내용을 제거하고 새로운 내용을 수신 div에 작성합니다.

. Append가 내용에 추가합니다.

대신 HTML() 대신 append() 또는 preprend()를 사용하십시오.