jQuery UI removeClass顯示沒有動畫

我有一個表格行顯示，應該突出顯示一小段時間。要做到這一點，我有使用jQuery UI functions這段代碼：jQuery UI removeClass顯示沒有動畫

$('tr#' + currentlyAdded).addClass("highlighted", 600, "easeInQuad", function() { 
    $('tr#' + currentlyAdded).removeClass("highlighted", 1500, "linear"); 
});

所以我添加類highlighted與指定的寬鬆政策，這工作完全正常。之後，我希望這個類能夠被這樣的動畫去掉，但是無論我指定哪個時間或者緩動，它都會消失。在代碼的其他地方，我測試removeClass()的功能，它似乎一般工作就像我期望的那樣。

在addClass的回調中使用removeClass有什麼問題，或者是在這裏引起問題的原因是什麼？

編輯：表結構：

<div class="jumbotron content"> 
    <div class="row "> 
     <div class="col-md-8 col-xs-12" id="no-more-tables"> 
      <table class="table table-hover"> 
       <thead> 
        <tr> 
         <th></th> 
         <th>Name</th> 
         <th>Vorname</th> 
         <th>Nr.</th> 
         <th>Aktionen</th> 
        </tr> 
       </thead> 
       <tbody id="emp_table"> 
        <tr id="8b08e40a-0e59-47e7-bb05-fa6626e998d8" onclick="onListClick(this,id);"> 
         <td><img src="/Content/pic/Person1.jpg" width="64"></td> 
         <td data-title="Name">Name</td> 
         <td data-title="Vorname">Vorname</td> 
         <td data-title="Nr.">000013</td> 
         <td data-title="Aktionen"> <input id="0" class="fb8" type="button" value="Edit" onclick="showDetails(id);"> </td> 
        </tr>

正如你可以看到我使用自舉在這裏。因此，只有我指定的CSS是這樣的：

highlighted類：

.highlighted{ 
    background-color:#fe9a2e!important; 
}

使用這裏重要的，因爲jumbotron類將重寫我的tr。

編輯2：

我創建了一個小提琴重現錯誤，但不知何故，在這裏工作。所以我發現有人編輯了bootstrap.min.css文件，這樣這些樣式就像jumbotron中的不同行顏色出現奇數和偶數。但知道這我仍然無法弄清楚爲什麼這是行不通的。我也嘗試過在沒有jumbotron的班上進行測試，但仍然沒有成功。

編輯3： 終於得到了問題：由於我使用!important我的課，jQuery的動畫從來都不是可見的。在removeClass()函數正在工作的同時檢查HTML，我可以看到它將style="background-color:rgb(..)"添加到由於類而沒有效果的行。

來源

2015-11-05 Eddi

在css中放置你的轉換幾乎肯定是一個問題。請提供您的css –

提供您的表格結構！ – deepakb

檢查[this]（https://jsfiddle.net/vz33yk86/7/）。在這裏工作很好。 – deepakb

正如我的編輯說，該問題的答案是繼：

當您試圖爲標記爲!important的CSS屬性設置動畫時，jQuery的動畫實際上正在發生但不可見。因此，刪除!important部分將解決此問題。

來源

2017-01-16 15:09:09 Eddi

-1

不知道更多我不會完全知道，但我想知道它的潛在變量currentlyAdded可能會變得泥濘的地方？

可能改變你的代碼，看看它是否有更好的結果？

$('tr#' + currentlyAdded).addClass("highlighted", 600, "easeInQuad", function() { 
    $(this).removeClass("highlighted", 1500, "linear"); 
});

回調使用$(this)應該有希望的目標已經有了類高亮添加到它的元素，即使不知何故變量改變

來源

2015-11-05 11:46:55 jthawme

是的，我應該使用$（this），但是這不會有太大的改變，因爲課程仍然會被移除而不顯示任何動畫。 – Eddi

'$（this）'和''tr＃'+ currentlyAdded'之間沒有任何區別 –

如果在執行回調之前'currentlyAdded'發生了變化，那麼元素將不會是相同的元素。 '$（this）'意味着添加類的元素是回調中定位的元素 – jthawme

jQuery UI removeClass顯示沒有動畫

回答

相關問題