Question

每次我点击代码中指定的类时，我想重复相同的过程。它正在处理悬停功能但是当我切换到单击功能时，它只完成一次工作。而且它不可重复。

此外，我切换到clickToggle并且它不起作用。有什么想法吗？

<% @root_links.each do |link| %>
  <% if link.dropdown == true %>
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><%= link.text %> <span class="caret"></span></a>
      <ul class="dropdown-menu">
      <% link.children.each do |child_link| %>
        <li><a href="<%= child_link.url %>"><%= child_link.text %></a></li>
      <% end %>  
      </ul>
    </li>
  <% else %>    
    <li><a href="<%= link.url %>" target="<%= link.target %>"><%= link.text %></a></li>
  <% end %>
<% end %>

Answer 1

jquery hover()函数将两个函数作为参数：handleIn和HandleOut。

Click does not.

因此，您必须使用单独的变量跟踪点击状态。

例如：

var sidebarFloat = $('.sidebar').css('float');
var toggled = false;
$('.sidebar').click(function() {
    if (toggled) {
        sidebarFloat = $(this).css('float');
        if (sidebarFloat == 'right') {
            $(this).stop().animate({
                left: "0px"
            }, 500)
        } else if (sidebarFloat == 'left') {
            $(this).stop().animate({
                left: "0px"
            }, 500)
        }
    } else {
        var width = $(this).width() - 10;
        if (sidebarFloat == 'right') {
            $(this).stop().animate({
                left: +width
            }, 500);

        } else if (sidebarFloat == 'left') {
            $(this).stop().animate({
                left: -width
            }, 500);
        }
    }
    toggled = !toggled;
});

切换而不是悬停函数jQuery

1 个答案: