如何在一次点击中隐藏div并在另一次点击中取消隐藏？

我想添加一个else语句到我的javascript，目前如果用户点击一个链接，然后一个div隐藏，但我想这样，如果他们再次点击链接div div unhides。有人可以告诉我我该怎么做，谢谢？如何在一次点击中隐藏div并在另一次点击中取消隐藏？

<a id="myLink" href="javascript:void(0)" onclick="javascript:myLinkButtonClick();"><h3 id="bobcontent1-title" class="handcursor"><img src="assets/img/help_support/howdo.png" width="302" height="45" /></a> 

<script> 
function myLinkButtonClick() 
{ 
    $(".nswp-frame2").hide(); 
} 
</script>

来源

2013-03-26 James Pale

HTML所属的HTML文件，CSS所属的CSS文件，JS属于在js文件中。不要混合搭配。 – zzzzBov 2013-03-26 17:56:17

因为它似乎你使用jQuery，您可以简单地使用toggle()方法。

例如：

$('#myLink').on('click', function() { 
    $(".nswp-frame2").toggle(); 
});

的toggle()方法节目和可互换隐藏元件，这取决于如果元素是当前可见或隐藏。

作为一个附注，请注意本示例如何以不显眼的方式将处理程序与click事件绑定到on()事件，而不是您示例中的突兀（内联）代码。这也意味着这段代码应该是单独的脚本声明的一部分，并且最好在页面加载后执行。因此，一个更完整的例子是：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#myLink').on('click', function() { 
      $(".nswp-frame2").toggle(); 
     }); 
    }); 
</script>

来源

2013-03-26 17:54:11 Boaz

function myLinkButtonClick() 
{ 
    var $element = $('.nswp-frame2'); 
    if($element.is(':visible')){ 
     $element.hide(); 
    } else { 
     $element.show(); 
    } 
}

或者，你也可以简单地使用.toggle方法：

function myLinkButtonClick() 
{ 
    $('.nswp-frame2').toggle(); 
}

来源

2013-03-26 17:55:04

如何在一次点击中隐藏div并在另一次点击中取消隐藏？

回答

相关问题