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/

现在我需要一个更改...当我有多个项目时，如果他们仍然打开其他关闭项目

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">');

Javascript显示更多文本

1 个答案: