Question

我有一个切换一个hiden div的锚点。当我将鼠标悬停在它上面时，我能够更改锚图标（我已经完成了一个精灵），但是我无法添加第二个.click事件，这让我可以将锚更改为'btn_close'图标。<登记/>
我希望代码可以做到：
悬停在'btn_open'------它变为'btn_open'：悬停
点击'btn_open'------它变为'btn_close'并切换hiden div 悬停在'btn_close'上------它变为'btn_close'：悬停
点击'btn_close'------它变为'btn_open'并切换hiden div

我做了这个小提琴，简化了我的问题（显示了我达到的目的） http://jsfiddle.net/weberjavi/72xSL/

HTML：

<body>
<a href="#" class="btn_open">open</a>  
<div id="content"></div>
</body>

的jquery：

$("#content").hide();
$(".btn_open").click(function () {
$("#content").toggle("slow");
return false;
});

谢谢大家。

Answer 1

试试这个我不确定这是不是你要做的事

添加切换按钮会改变按钮的类别，如果它已经在元素上，则删除一个按钮，如果没有则添加它。

我将处理程序附加到其类以btn开头的所有元素，这将使其适用于btn_close和btn_open

$("#content").hide();
$("[class^=btn]").click(function () {
    $(this).toggleClass("btn_open btn_close")
    if($(this).hasClass("btn_close")){
      $(this).text("close")
    }else{
      $(this).text("open")
    }
   $("#content").toggle("slow");
    return false;
});

Fiddle

锚图标，隐藏div，悬停和点击时更改

1 个答案: