-2

分区是display: none;

当我单击链接或图像时,我将其更改为display: block;正常工作。

当我点击同一个图标或链接时,我希望它消失。

因此,如果链接处于活动状态,则会显示 Div,然后单击返回链接更改显示选项。

4

3 回答 3

5

使用

<a href="#" id="toggleLink">Show</a>

你可以这样做:

纯JS

Live Demo

window.onload=function() {
  document.getElementById("toggleLink").onclick=function() {
    var div = document.getElementById("someDiv");
    var show = div.style.display;
    div.style.display = show=="none"?"block":"none";
    return false;
  }
  div.style.display="none"; // init
}

jQuery:

Live Demo

$(function() {
  $("#toggleLink").on("click",function(e) {
    e.preventDefault(); 
    $("#someDiv").toggle();
  });
});

如果您想将文本从显示切换到隐藏,请在返回 false 之前将其添加到纯 JS

    this.innerHTML=div.style.display=="none"?"Show":"Hide";

这对 jQuery

$(this).text($("#someDiv").is(":visible")?"Hide":"Show");
于 2013-09-17T13:31:16.143 回答
2

这是一个显示工作概念的jsfiddle:

http://jsfiddle.net/DjxM8/

$("#clickme").click(function() {
    $("#showme").toggle();
});

jQuery 的切换功能可能就是你想要的。

于 2013-09-17T13:23:46.787 回答
-1

在 jQuery 中,您可以执行以下操作:

$('div').click(function(){
    if ($('div').css("display") == "block"){
        $('div').("display", "none");
    }
    else{
        $('div').("display", "block");
    }
});

编辑:对于这种特殊情况,切换方法更可取。如果您希望为事件添加超过 2 个结果,例如如果您想循环使用不同的背景颜色,我建议您按照我的方式进行操作(蹩脚的例子,但很重要)

于 2013-09-17T13:23:52.473 回答