隐藏/显示不刷新，更改onclick行为像切换

Question

非常快的问题…和一个基本的(这一天太长了!)

此刻点击更新/查看客户端加载一个php文件到页面上而不刷新。这是伟大的，但什么是最简单的方法，使点击相同的锚标记行为更像一个切换(显示/隐藏)?

jQuery:

 $("#searchClient").bind("click", function() {
              $("#search").load("inc/search.php?r=clients")
         });

HTML:

<a href="#" id="searchClient"><h3>Update / View Existing Client</h3></a>
<div id="search"></div>

我不想要任何花哨的滑动，只是简单的弹出弹出。很多谢谢!

Answer 1

假设#search是隐藏的

$("#searchClient").bind("click", function() {
    var $search = $("#search");
    if ($search.is(':hidden')) {
        $search.load("inc/search.php?r=clients", function () {
            $search.show();
        });
    } else {
        $search.hide();
    }
});

否则你可以跟踪它是否被加载:

$("#searchClient").bind("click", function() {
    var $search = $("#search");
    if ($search.is(':hidden')
        || $search.data('loaded') == undefined) {
        $search.load("inc/search.php?r=clients", function () {
            $search
                .data('loaded', true)
                .show();
        });
    } else {
        $search.hide();
    }
});