单击链接时展开,第二次单击时隐藏

时间:2015-04-13 03:08:10

标签: jquery

我有一个正在运行但只有一种方式的脚本..我希望它在第二次点击相同的链接时隐藏它。

$('.EndPoint').on('click', function () {
$('.EndPoint').find('div').hide();
$(this).find('div').show();

Fiddle

- 更新1 -

尝试使用此解决方案http://jsfiddle.net/ksvexr40/2/,但它现在正确隐藏......两个问题1)只有部分内容被隐藏2)它从扩展开始。我正在使用.append()来引入数据并拥有它们的许多实例..下面的一些例子

                    var set = $('<div><a href="#" class="clicker"><h3>['+i+'] ' + endpoint1.ipAddress+ ' - ' +endpoint1.serverName+ '</h3></a></div>');
                $response0.append(set);

                if (endpoint1.serverName == null) {
                    var serverName = '<div class="hideThis"><b>Server Name:</b> n/a</div>';
                    set.append(serverName);
                    } else if (endpoint1.serverName != null) {
                        set.append('<div class="hideThis"><b>Server Name:</b> ' + endpoint1.serverName+'</div>');
                    } set.append('<div class="hideThis"><b>IP Address:</b> ' + endpoint1.ipAddress+ '<br></div>');

2 个答案:

答案 0 :(得分:1)

$(this).find('div').toggle();会这样做

$('.hideThis').hide();
$('.clicker').on('click', function () {
    $('.hideThis').not($(this).next()).hide();
    $(this).next().toggle();
});

http://jsfiddle.net/ksvexr40/2/

答案 1 :(得分:1)

您可以使用.is(":visible")检查元素的可见性:

$('.EndPoint').on('click', function () {
   if($(this).find('div').is(":visible"))
   {
       $(this).find('div').hide();
   }else{       
       $(this).find('div').show();
   }
}