jQuery html()의 HTML 엔터티

Question

div의 가시성을 전환하는 숨겨진 div 및 링크가 있습니다. 링크에는 text/html도 포함되어있어 '숨기기'/ '표시'할 수 있습니다. 여기 제 기능입니다 : 내가하는이 처음 "↑ 숨기기"로 전환하고 붙어 남아있는 포인트는 HTML (↑ 및 ↓)에 화살표를 추가 할 때까지 의도 한대로이 기능은 작동

jQuery('#toggle_filter_link').click(function() { 
    jQuery('#searchfilter_wrap').slideToggle("slow"); 
    jQuery(this).html(jQuery(this).text() == 'Hide ↑' ? 'Show ↓' : 'Hide ↑'); 
}); 

.

여기에 a jsFiddle입니다.

나는 HTML 엔터티를 어떻게 든 피할 필요가 있다고 생각하지만 첫 번째 스위치가 작동한다는 것을 생각하면 혼란 스럽다. 그것은 내가 분명히 분명한 뭔가 분명하다. :-)

도움을 주셔서 감사합니다!

Answer 1

당신은 텍스트jQuery(this).html()-jQuery(this).text() 변경

HTML 을 비교하고 있습니다.

브라우저가 HTML을 표준화하는 방식으로 인해 여전히 문제가있을 수 있으며 다른 조건을 테스트하는 것이 더 나을 것입니다.

jQuery('#toggle_filter_link').click(function() { 
    jQuery('#searchfilter_wrap').slideToggle("slow"); 
    var $this = jQuery(this); 
    if ($this.hasClass('show')) { 
     $this.removeClass('show'); 
     $this.html('Hide ↑'); 
    } else { 
     $this.addClass('show'); 
     $this.html('Show ↓'); 
    } 
}); 

... 아니면 그냥 정상화 될 수 없습니다 뭔가를 테스트 :

jQuery('#toggle_filter_link').click(function() { 
    jQuery('#searchfilter_wrap').slideToggle("slow"); 
    jQuery(this).html(jQuery(this).text().indexOf('Hide') > -1 ? 'Show ↓' : 'Hide ↑'); 
});