Javascript 使onClick事件每隔单击一次就执行不同的操作？

我在一个表中有3列，每列顶部有一些文本，下面有一个图像。我有这样的功能，当有人从3列中的一列单击图像时，它会放大该列，并使用onClick事件删除其他列。但是，我希望这样，当我第二次单击图像时，它会返回其他列。我遇到的问题是如何让onClick事件在我第二次单击它时做一些不同的事情。我添加了几张（画得不好的）图片来帮助您了解情况。谢谢你抽出时间

哦，还有我当前的javascript部分代码（狗、万圣节和喜剧是每个图像的ID。请原谅我糟糕的（不存在的）缩进；仍在学习javascript的课程中。）：

---

您需要的是一个可供所有函数访问的变量，它将告诉您表处于什么“模式”：

var allColumns = true;

function comedy() {
    if (allColumns) {
        // ... do stuff here ...
        allColumns = false;
    } else {
        // ... do different stuff here ...
        allColumns = true;
    }
}

---

如果您使用的是jquery，则可以执行以下操作：

function bindImageClick(){    
    $("#imgid").unbind("click");
    $("#imgid").bind("click", function (event) {
        alert("first click");
        $(this).unbind("click");
        $(this).bind("click", function(){
           alert("second click");
           bindImageClick();
        });
    });
}
bindImageClick();

---

这里有一个活生生的例子：

像这样的事情非常简单：

// Put this within the scope of the <a /> below...
var whichClick = 1;

// The link
<a href="..." onclick="javascript:doSomething(whichClick++ % 2 == 1)">Click Me</a>

// The handler
function doSomething(isOdd){
    // isOdd is true or false, respond accordingly
}

//将其置于
//处理者
功能剂量测定法（isOdd）{
//isOdd为真或假，请相应地进行响应
}

等等

编辑调整以使函数arg成为布尔值

干杯

很简单，请看小提琴

HTML

JQUERY

$(document).ready(function(){
  $("#click").toggle(
   function(){
     $(this).css('width',200).siblings().hide();;
   },
   function(){
     $(this).css('width',50).siblings().show();;
   }
  );
})

---

由于我对javascript还是新手，我真的不知道该尝试什么。我在Google和here上搜索了我在标题中输入的内容（以及一些细微的变化），但没有找到任何相关的内容。您可能想查看那些绑定/取消绑定调用。不过op看起来并没有使用jQuery。谢谢！其他答案也很有用，但这是最简单的，不需要jQuery。如果其他答案有用，我建议投票表决。

<table>
<tr>
    <td>Column1</td>
    <td id="click">Column2</td>
    <td>Column3</td>
</tr>
</table>

td{
  border:1px dotted #ccc;
  width:50px
 }

$(document).ready(function(){
  $("#click").toggle(
   function(){
     $(this).css('width',200).siblings().hide();;
   },
   function(){
     $(this).css('width',50).siblings().show();;
   }
  );
})