当您第二次单击复选框时,我试图删除类“事件”,就像 Pinterest 在用户添加图钉时对 Twitter/Facebook 复选框所做的一样:
点击时添加“事件”类很容易。但是,我不知道如何在添加后删除它。我试过了,但没用:
$(".add_link_twitter.active").click(function(e) {
$(this).removeClass(activePostTwitter);
});
我有两个问题:
- 如何在第二次点击时删除“事件”CSS 类 复选框?
- 如何在 Twitter 上禁用“.add_link_twitter:hover” 是否选中复选框?
提前致谢!
这是 jQuery:
var postTwitter = ".add_link_twitter";
var activePostTwitter = "active";
$(postTwitter).click(function(e) {
$(this).addClass(activePostTwitter);
});
这是 html:
<label class="add_link_twitter">
<input type="checkbox" name="publish_to_twitter" class="publish_to_twitter"><span>Share on Twitter</span>
</label>
这是CSS:
.add_link_twitter{
position:absolute;
left:15px;
bottom:16px;
color: #a19486;
border: 2px solid transparent;
border-color: #F0EDE8;
border-radius: 4px;
font-size: 13px;
font-weight: bold;
cursor: pointer;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
}
.active {
border-color: #468BD0;
color: #468BD0;
background-color: whiteSmoke;
}
.add_link_twitter:hover
{
color: #A19486;
border: 2px solid transparent;
border-color: #C2B1A2;
border-radius: 4px;
background-color: white;
padding: 7px;
padding-top: 5px;
padding-bottom: 5px;
}
最佳答案
代替
$(postTwitter).click(function(e) {
$(this).addClass(activePostTwitter);
});
使用
$(postTwitter).click(function(e) {
$(this).toggleClass(activePostTwitter);
});
编辑:
事件每次点击触发两次,可能是因为事件传播。要解决此问题,请将处理程序分配给 input
并让它更改其父级的类:
$(postTwitter + " input").click(function(e) {
$(this).parent().toggleClass(activePostTwitter);
});
确认jsfiddle:http://jsfiddle.net/bpfqB/
关于javascript - jQuery 在第二次单击时删除类并在第二次单击时禁用悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12116162/