자바 스크립트 자세한 텍스트 표시

Question

나는이 코드를 사용하여 사용자가 제목을 클릭하거나 아이콘 (images/onmenos.jpg, images/onmais.jpg)을 클릭하면 모든 텍스트가 "teste1"인이 예제를 숨기고 표시합니다.이 경우에는 클릭 만하면 모든 것이 잘 작동합니다. 하지만이 예와 같이 모든 텍스트에 링크가있을 경우 링크는 텍스트 "클릭"을 아이콘 images/onmenos.jpg로 변경합니다.이 태그는 ...을 원하지 않습니다.

JavaScript "<a href..."이 아이콘을 표시 모든 것을 ...

<script type="text/javascript"> 
$(document).ready(function() { 
$('.toggle_container').hide(); 

$("span.trigger a").click(function() { 

$(".toggle_container", $(this).parent()).animate({ opacity: 1.0 },200).slideToggle(500, function() { 


$("a", $(this).parent()).html($(this).is(':visible') ? '<img src="images/onmenos.jpg">' : '<img src="images/onmais.jpg">'); 


}); 
}); 

}); 
</script> 

HTML

<font style="font-size:18px; line-height:18px; color:#ffffff;">teste1</font> 
<span class="trigger" style=" margin-left:655px;"><a href="javascript:;"><img src="images/onmais.jpg" width="27" height="27" border="0"></a> 
<div class="toggle_container"> 
<a class="teste" href="http://www.teste.com" target="_new"><font style="font-size:18px; line-height:18px; color:#ffffff;">Click</font></a><p /> 
</div> 
</span> 

http://jsfiddle.net/2cmRa/

이 지금은 하나의 변화가 필요하다고 가정 ... 난 m가있을 때 한 항목 이상, 다른 항목을 열 때 아직 닫힌 상태이면 닫음

Answer 1

"더"버튼에 클래스를 사용하십시오. 어쩌면이 jsFiddle Update가 도움이 될 것입니다.

수정 된 HTML :

<a class="more" href="javascript:;"> 
    <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR6YRl-z_3JYYWCGScfalkWjL8_iYrvNHXK3WehdDIlp5vnUXpa" width="27" height="27" border="0" /> 
</a> 

수정 JS는 :는

$("a.more", $(this).parent()).html($(this).is(':visible') ? '<img src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSPWCyjrSVQF2vapeyiywRtx5EzIFERSrcI7fodWeSMF9fEKWE0">' : '<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR6YRl-z_3JYYWCGScfalkWjL8_iYrvNHXK3WehdDIlp5vnUXpa">');