一個簡單的腳本，適用於懸停，但爲什麼我不能讓它爲點擊工作？

我有一個非常簡單的js腳本，適用於懸停，但我想將懸停轉換爲點擊功能。當我嘗試切換懸停點擊時，它不起作用。一個簡單的腳本，適用於懸停，但爲什麼我不能讓它爲點擊工作？

下面是完整的示例腳本僅供參考。當某人懸停在這堂課上時，下面會出現一些帶背景的文字。 http://pastebin.com/JMTfvDAa

這裏就是我試過點擊 http://pastebin.com/M0X37APD

如果有人可以幫助我隱蔽懸停到點擊，我會重不勝感激！

感謝，

來源

2012-05-17 Irlanco

我不能推薦http://jsfiddle.net作爲在SO上發佈代碼示例的方式。 – Blazemonger

退房http://jsfiddle.net –

它應該工作。我想，你在其他地方有錯誤。你可以使用[jsfiddle]（http://jsfiddle.net/）而不是pastebin嗎？ – Jashwant

嘗試像下面，

$(document).ready(function() { 
    $(".menu a").click(function() { 
     var $this = $(this); 

     if (!$this.hasClass('clicked')) { 
      $this.next("em").animate({ 
       opacity: "show", 
       bottom: "-155" 
      }, "fast"); 

      $this.addClass('clicked'); 
     } else { 
      $this.next("em").animate({ 
       opacity: "hide", 
       bottom: "-165" 
      }, "fast"); 

      $this.removeClass('clicked'); 
     } 

    }); 
});

DEMO

來源

2012-05-17 19:09:26

啊，這真是太棒了，非常感謝你！對不起，我下次會使用jsfiddle謝謝你們！ – Irlanco

如果你想切換與點擊元素的狀態，你需要保存其狀態別的地方 - 無論是一個全局變量（不是一個好習慣），或在.data()變量在元素本身。

實施例：

$(".menu a").bind('click', function() { 
    $el = $(this).next('em'); 
    if ($el.data('switched')) { 
     $el.data('switched',false) 
      .animate({ 
      opacity: 1, 
      bottom: "-155" 
     }, "fast"); 
    } else { 
     $el.data('switched',true) 
      .animate({ 
      opacity: 0, 
      bottom: "-165" 
     }, "fast"); 
    }; 
});

來源

2012-05-17 19:08:31 Blazemonger

感謝您的提示！我會投票給你們，但不能哈哈。 – Irlanco

 $(document).ready(function(){ 
      $(".menu a").toggle(function() { 
       $(this).next("em").animate({opacity: "show", bottom: "-155"}, "fast"); 
      }, function() { 
       $(this).next("em").animate({opacity: "hide", bottom: "-165"}, "fast"); 
      }); 
     });

jQuery有一個內置的函數，該函數。

來源

2012-05-17 19:17:59 Fresheyeball

一個簡單的腳本，適用於懸停，但爲什麼我不能讓它爲點擊工作？

回答

相關問題