如何在单击链接时添加和删除类名
How to add and remove a class name from a link when clicked?
我想在我的rails应用程序中的表中切换2链接(send_email
和email_sent
)的可见性。两个链接都在同一单元格内。
<table >
<% @applications.each do |application| %>
<tr>
<td>
<a href="mailto:grant@example.com" class="send_email">Invite for an interview</a>
<a href="" class="email_sent hidden">Undo</a>
</td>
</tr>
<% end %>
</table>
在我的css中有
.hidden{display: none;}
这是我的javascript
<%= javascript_tag do %>
$(function(){
$('.send_email > a').click(function(){
// add the hidden class to send_email
// remove the hidden class from the next email_sent link
});
$('.email_sent > a').click(function(){
// add the hidden class to email_sent
// remove the hidden class from the previous sent_email link
});
});
<% end %>
您可以简单地使用jQuery中的removeClass()
和addClass()
。
Remove Class docs.
添加类文档
你做错了。$('.send_email > a')
意味着您有send_email
类到锚的父元素。$('a.send_email')
是使用类选择锚的正确方法。
我会像这样使用hide()
, show()
:
$('a.send_email').click(function(){
$(this).hide();
$('.email_sent').show();
});
$('a.email_sent').click(function(){
$(this).hide();
$('.send_email').show();
});
相关文章:
- 删除添加行
- 删除添加的事件侦听器
- 删除添加的输入字段
- 如何在 fabricjs 中从画布中删除添加的模板
- 删除添加空值的 Javascript 对象项
- .append() 删除添加的元素
- Javascript/jQuery - 根据数值删除/添加多个元素的类
- 单击时添加几行,双击删除添加的行
- 从表单中删除添加的元素不起作用
- 当我在单击元素外部时,如何删除添加到单击元素的功能
- 从javascript数组内的对象中删除/添加特定变量
- 如何使用单击hypelink从表单输入文本字段中删除/添加属性
- 想要在单击删除链接时删除添加到缩略图中的图像
- TinyMCE 4删除/添加所有图像的属性
- 当一天的开始和结束时间改变时,删除/添加正确的
's - 使用JavaScript删除添加到选定文本的高亮
- 删除/添加类函数
- 删除/添加一个类,然后在这个新类上执行一个事件
- TinyMCE插件-如何删除添加的代码
- 使用jquery删除/添加类到正文