我有一个大的div:
.limeskin:hover {
background: #eee;
cursor: pointer;
display: block;
}
我想要点击。因为我正在使用Rails,所以我需要点击一个Rails链接: 例如
<%= link_to 'Edit Your Email Address', edit_user_path %>
我正在努力解决这个问题。
这是整个街区:
<% @user.posts.each do |post| %>
<div class="lists">
<ol class="limeposts">
<li>
<div class="limeskin">
<div class="limebox">
<div class="limecost">
<b>Price:</b>
<%= number_to_currency(post.price, :unit => "R") %><br>
[...]
<% end %>
任何简单的法律可行答案?
由于
答案 0 :(得分:49)
link_to
可以接受阻止:
<%= link_to root_path do %>
<div>Hey!</div>
<% end %>
这将使用<a>
标记围绕div。
文档:http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to
或者如果你有一个很大的div并想使它“可点击”,使用jQuery:
# html.erb
<div class="limeskin">
<div class="limebox">
<div class="limecost">
<b>Price:</b>
<%= number_to_currency(post.price, :unit => "R") %><br>
#[...]
</div>
</div>
</div>
# jQuery.js
$('.limeskin').click( function(event) {
var clicked_div = $(this);
# do stuff with the event object and 'this' which
# represent the element you just clicked on
});
答案 1 :(得分:1)
使用javascript(我推荐jQuery)让动作真正发生,CSS hover
选择器修改div背景和光标(将光标从箭头改为手)。
答案 2 :(得分:1)
即使您有一个包含多个标签的大块,也可以使用如下所示的Link_to:
<%= link_to desired_path do %>
<div class="linkable">
<another div>
... some other tags
</another div>
</div>
<% end %>
我建议你为鼠标悬停事件使用不同的背景颜色,因为它会向观众显示它是一个链接!
在.css文件中:
.linkable:hover{
background-color: red;
}