Question

HI al

我试图在一堆图像元素上允许一种“切换”状态，因此他们有

翻滚，
onclick图像更改和
列出项目单击时更改ID。

我能做的很多，但是当他们第二次点击时（即返回原始图像，重新设置翻转并恢复原始ID），我无法让他们恢复。

这是我的代码：

$("#Table1 img").each(function () { // loops round every image in Table1
    $(this).hover(function () {   // sets hover rules
        this.src = "images/mine.gif"
    },function () {  // mine.gif for mouseover, available.gif for mouseout
        this.src = "images/available.gif"
    });
    $(this).click(function () { // sets click rules
        this.src = "images/mine.gif"; // mine.gif for onclick
        this.id = "x" + this.id; // adds an 'x' to the ID of clicked images
        $(this).unbind("mouseover mouseout"); // removes mouseover and mouseout events to keep visual selection
        $(this).click(function () {
            this.src = "images/available.gif";
            this.id = this.id.substr(2, this.id.length);
        });
    });
});

我尝试在第二个$(this).hover()中嵌入$(this).click()函数，但这不起作用。

上面的代码完全有效，但我无法恢复原始的翻转。

非常感谢任何帮助。我意识到有更优雅的方式来做我已经在jQuery（委托等等）做过的事情但是因为我正在学习我想先用简单明了的方式做到这一点。

：）

Answer 1

我能够通过使用该类来维护图像点击的状态。不必移除悬停，只需在执行悬停函数内的任何代码之前检查图像的状态。我也使用.toggle（）而不是尝试嵌套.click（）监听器。

http://jsfiddle.net/e8CdP/

jQuery - 点击更改事件，然后在第二次点击时恢复原始事件？

1 个答案: