切换按钮以显示和隐藏注释和WordPress注释表单

Question

I'm using WordPress Liveblog and a not-yet merged pull-request so will reference the code directly on the GitHub repo to hopefully explain my question better. Please see here for a working example of the plugin code in action.

The WordPress comment form is shown when I click on the Reply button . Before clicking the button, the form is hidden from view.

The comments are shown when I click on the second reply button > Reply

My aim is to replace both buttons with one single button called Toggle. When clicked, I'd like both the WordPress comment form AND the comments to be displayed.

So far I have done the following...

My Toggle button:

<a class="toggle" href="#">Toggle</a>

My script (modified from here ):

jQuery('a.toggle').click(function () {

    var openImgUrl = 'open.png',
        closeImgUrl = 'close.png';

    var $newsItem = jQuery(this).closest('.news-text'),
        $newsContent = $newsItem.find('.news-content'),
        isContentVisible = ($newsContent.is(':visible'));

    // slide up all shown news-items - but its expected that only one is visible at a time
    jQuery('.news-text').find('.news-content').slideUp(function () { 
        // on animation callback change the img
        jQuery('.news-text').find('.toggle > img').attr('src', openImgUrl);
    });

    if (!isContentVisible) { // if the new-item was hidden when clicked, then show it!
        $newsContent.slideDown(function () {
            // on animation callback change the img
            $newsItem.find('.toggle > img').attr('src', closeImgUrl);
        });
    }

    return false; // stop postback
});

Using my script and toggle button, when the Toggle button is clicked, comments are displayed under each entry. When the toggle button is clicked again, the comments are hidden. However, this doesn't take the WordPress comment form into account.

How can I get the WordPress comment form to display along with the comments when the Toggle button is clicked?

Liveblog Glossary:

Entry: An entry is a top-level comment just like a standard 'comment' made in WordPress.

Comment: Comments can be made on entries.

Answer 1

I found comment_reply_link to be the answer!

http://codex.wordpress.org/Function_Reference/comment_reply_link

Using this function to output the reply link enabled me to do what I needed. I just had to change my selector in my script to use the comment reply button as the toggle and remove the original toggle button I had set up. For example:

jQuery('a.comment-reply-link').click(function () {