Jquery Mouseenter點擊刪除班級不工作

我真的希望有人可以幫忙。我有一個無序的錨點列表，它在鼠標輸入上不透明（css默認爲0.7），並且在mouseleave上再次輸出。Jquery Mouseenter點擊刪除班級不工作

單擊時，我想添加一個使不透明度保持滿的類。到目前爲止，但從匹配的元素中刪除類目前不起作用 - 其他項目也保持完全不透明狀態。

這裏是Jquery的：

$(document).ready(function() { 

     $("#nav a").mouseenter(function() { 
      $(this).fadeTo("slow", 1); 
      $("#nav a").click(function() { 
       $(".activeList").removeClass("activeList"); //THIS PART ISN'T WORKING 
       $(this).addClass("activeList"); 
      }); 
     }); 

     $("#nav a").mouseleave(function() { 
      if (!$(this).hasClass("activeList")) { 
       $(this).fadeTo("fast", 0.7); 
      } 
     }); 
    });

我想這是因爲我被困在因的mouseenter的元素，只能影響（這一點）。已經嘗試過.bind/.unbind，嘗試了自己的（它的工作）和其他一些東西的添加/刪除類，但沒有運氣到目前爲止！任何建議將不勝感激。

來源

2012-07-06 Sundance.101

行的語法不工作很好，一個快速測試證明它的工作原理（無論如何我的測試）。那麼它不起作用，是不是從先前點擊的元素中刪除類？控制檯中是否有錯誤？ – SmokeyPHP 2012-07-06 21:19:11

是的，沒有刪除以前點擊過的類。 – 2012-07-07 03:31:37

試試這個：

$(document).ready(function() { 

     $("#nav a").mouseenter(function() { 
      $(this).fadeTo("slow", 1); 
     }); 

     $("#nav a").click(function() { 
      $(".activeList").removeClass("activeList"); //THIS PART ISN'T WORKING 
      $(this).addClass("activeList"); 
     }); 

     $("#nav a").mouseleave(function() { 
      if (!$(this).hasClass("activeList")) { 
       $(this).fadeTo("fast", 0.7); 
      } 
     }); 
    });

來源

2012-07-06 21:15:16

看起來應該可以工作。爲了提高效率，你也可以鏈接3個部分，因爲他們都引用'$（「＃nav a」）' – Rodolfo 2012-07-06 21:20:57

嗨，對不起，仍然沒有工作。 – 2012-07-07 03:36:05

試試下面的（這幾乎是相同的代碼，但不同的佈局，一些調整）：

$(document).ready(function() { 

    $("#nav a").hover(function(e) { //On hover in 
     $(this).fadeTo("slow",1); 
    },function(e) { //On hover out 
     if(!($(this).hasClass("activeList"))) 
     { 
      $(this).fadeTo("fast",0.7); 
     } 
    }).click(function(e) { //On click 
     $("#nav a").removeClass("activeList"); 
     $(this).addClass("activeList"); 
    }); 
});

來源

2012-07-07 15:31:39 SmokeyPHP

你好Smokey。謝謝，我喜歡這段代碼的語義特性，但它仍然不會消除不透明性。已修復併發布，但將我的解決方案用於您的解決方案。謝謝：） – 2012-07-07 18:49:41

意識到透明度不脫落，直到懸停，也許是因爲頁面不刷新，不知道。編輯了我自己的代碼以使其工作，但認爲我可以將我的解決方案用於您的解決方案，因爲您的解決方案更具語義。下面是我的了：

$(document).ready(function() { 
    $("#nav a").mouseenter(function() { 
    if (!$(this).hasClass("activeList")) // Added IF here, only had it on 
             // mouseleave originally 
     { 
     $(this).stop().fadeTo("slow", 1); 
     } 
      $("#nav a").click(function() { 
      $(".activeList").stop().removeClass("activeList"); 
      $(this).stop().stop().addClass("activeList"); 
      $("#nav a").stop().not(".activeList").fadeTo("fast",0.7); 
    //The class came off, but the opacity didn't fade because no page refresh..? 
    //Added extra animation eliminating selected with .not to fix 

     }); 
     }); 
      //THE REST IS SUPERFLUOUS 
     $("#nav a").mouseleave(function() { 
     if (!$(this).hasClass("activeList")) 
      { 
      $(this).stop().fadeTo("fast", 0.7); 
      } 
    }); 
});

只好在我添加一些.stop部分，也因爲多次懸停並不好。現在將停止發佈，也許只是彈出一條評論，告訴您是否設法將我的答案整合到您的整潔代碼中。

非常感謝大家的發帖，我非常感謝！

來源

2012-07-07 18:43:27

我發現，不透明度是通過添加到元素的樣式屬性，以便消除該類不利於增加，嘗試清除風格以及類似這樣的：

$("#nav a").click(function() { 
     $(".activeList").attr("style", ""); 
     $(".activeList").removeClass("activeList"); 
     $(this).addClass("activeList"); 
    });

來源

2013-01-25 12:51:05

Jquery Mouseenter點擊刪除班級不工作

回答

相關問題