Question

我现在有这个：

<a href='javascript:showComments($displayWall[id]);' style='cursor: pointer;'>Show all $isThereAnyComments comments</a>

在showComments中成功，我希望它显示这个div：

#showWallCommentsFor + wallID

然后当它显示时，它应该将“全部显示”更改为“关闭”，然后它应该隐藏div。我怎么能这样做？

Answer 1

我的建议是快速浏览一些jQuery教程，因为一旦你看过一些例子并理解了基础知识，你所描述的功能应该非常简单。

http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

http://docs.jquery.com/Tutorials:Live_Examples_of_jQuery

http://www.w3schools.com/jquery/default.asp

Answer 2

var toggle = false;
$(function() {
    $('a.comments').click(function(e) {
        var $this = $(this);
        $('.toggleComments').toggle(1000,function() {
            if(!toggle) {
                $this.text('Hide Comments');
                toggle = !toggle;
            }else {
                $this.text('Show Comments');
                toggle = !toggle;
            }
        });
        e.preventDefault();
    });
});

测试上述代码@ http://jsbin.com/azuro3

Answer 3

HTML：

<div id="comments">
    <!-- comments here -->
</div>
<a href="#" class="commentsBtn">Show Comments</a>

Jquery的：

//Start with comments hidden
$('#comments').hide();
//Attach click event to button
$('.commentsBtn').click(function() {
    $('#comments').slideToggle('slow');
    $(this).text($(this).text() == 'Hide Comments' ? 'Show Comments' : 'Hide  Comments');

    //Kill the default function of the anchor tag
    return false;
});

CSS：

.commentsBtn { cursor: pointer; }

如果可能的话，应该避免使用内联javascript和CSS，在这种情况下它应该是。
请确保为您的评论设置容器div，并指定了ID或类别，可能是id =“comments”。
在show comments链接中添加一个类，您可以使用它来应用CSS样式和jquery选择器。

如果你完成它，请告诉我！一切顺利

jQuery：“显示所有评论”点击＆amp;躲在成功？

3 个答案: