jquery toggleClass無法在img元素上工作

我有兩個按鈕（「批准」，「取消批准」）和加載微調器的圖像。默認情況下顯示批准按鈕，隱藏未批准按鈕和加載微調器圖像。jquery toggleClass無法在img元素上工作

當單擊「批准」按鈕時，我希望它消失，顯示加載微調器，然後執行ajax請求。完成請求後，我想讓加載微調器圖像再次隱藏。如果ajax請求成功，我想要顯示「Unapprove」按鈕。如果ajax請求失敗，我希望「批准」按鈕再次顯示。

我遇到的問題是，在完成ajax請求後，我的.always（）方法會運行，但是微調器圖像不會隱藏。這裏有一個例子：

https://jsfiddle.net/ebme6fjs/7/

如果我改變我的Ajax請求給我一個404未找到錯誤的URL，這個過程就像它應該：

https://jsfiddle.net/ebme6fjs/8/

不任何人都知道爲什麼在我的第一個案例中，spinner.toggleClass("hide");命令沒有在always（）函數中運行？謝謝。

UPDATE：我發現一個有趣的事情是，如果我重新定義了我的微調可變的。總是（）函數，它工作正常上一個成功的Ajax請求：

https://jsfiddle.net/ebme6fjs/9/

如果您修改ajax url以接收404，但是，同樣的問題不會消失再次發生。

來源

2016-02-12 Bert Wagner

在完成後，您正在圖像上隱藏隱藏類，您應該使用：var otherButton = currentButton.siblings（「button」）;'您的UPDATE jsFiddle是錯誤，在總是回調中，'this'不是指單擊元素，而是jqXHR選項。所以事實上，你不會在總是回調中切換圖像類，**只是在完成 –

請在這裏發佈代碼。如果JSFiddle決定打包，那麼你的問題對於在 – mplungjan

@ A.Wolff之後來臨的人來說毫無價值，你注意到我正在調用siblings（）而不是兄弟（「按鈕」）來找到正確的問題。如果你想回答我可以標記你的正確。謝謝！ –

在您的代碼中，您在圖像上切換hide類兩次，在always()回調和done()/fail()之一。

這是因爲你在這兩個變量目標圖像，spinner&otherbutton。

您應該定義otherbutton如下：

var otherButton = currentButton.siblings("button");

不包括組匹配的圖像。

作爲一個便箋，爲了代碼的可讀性，您應該使用addClass()/removeClass()而不是KWeiss答案中提到的，btw，僅在always()回調中設置顯示/不顯示元素的所有邏輯。

來源

2016-02-12 13:02:59

在上下文中，你在總是想要添加類，請使用addClass而不是toggleClass。在你的代碼中，類會切換兩次：一次處於「始終」狀態，然後再次處於「失敗」狀態。所以它以與之前相同的狀態結束。

你兩次針對圖像的原因，是因爲你定義otherButton這樣的：

var otherButton = currentButton.siblings();

當你想要做的是這樣的：

var otherButton = currentButton.siblings('button');

toggleClass是最有用的，當您可能需要添加或根據某些條件刪除該類。

來源

2016-02-12 12:36:46 KWeiss

相同的元素在所有這三個位置都沒有被切換。微調器在always（）中被切換，並且currentButton和otherButton分別在fail（）和done（）中切換。但是，如果這是最佳做法，我可以使用addClass/removeClass。這樣做並不能解決我的問題。 –

jquery toggleClass無法在img元素上工作

回答

相關問題