爲什麼我的addClass不起作用？

-2

$(document).ready(function(){ 
    $("#box").draggable({ revert:"invalid" }); 
    $("#box2").draggable({ revert:"invalid" }); 
    $("#target").droppable({ 
     accept: "#box2", 
     drop: function(event,ui) { 
     accept: "#box2", 
      $("#target").addClass("changecolor"); } 

    }); 
});

我addClass不工作當我移動＃BOX2在#target。

請幫我一把。

在此先感謝。

來源

2014-01-25 user3235729

其工作在你的提琴 – Rooster

我無法看到它。邊框的顏色應該改變，或者如果我將類的背景顏色添加到類中......它不會改變。 – user3235729

您將它設置爲白色，並且已經有白色背景，因此您無法看到它。嘗試將它設置爲紅色或某些東西，如果你想看到它或設置背景顏色 – Rooster

你有幾個問題在這裏：

$(document).ready(function(){ 
    $("#box").draggable({ revert:"invalid" }); 
    $("#box2").draggable({ revert:"invalid" }); 
    $("#target").droppable({ 
     accept: "#box2", 
     drop: function(event,ui) { 
      //accept: "#box2", <- This is wrong and won't run 
      $(event.target).addClass("changecolor"); 
     } 
    }); 
});

取出accept: "#box2",
您可以通過使用$(event.target)或$(this)

得到目標CSS問題：
的方式CSS的作品，ID的優先級高於Classes，因此當您添加changecolor類時，它會贏得'不會覆蓋CSS。

你可以通過改變這個解決這個問題：

.changecolor{ 
    border: 1px solid white; 
}

到

#target.changecolor{ 
    border: 1px solid white; 
}

Here is a JSFiddle where it works

來源

2014-01-25 17:51:57

謝謝..現在與！重要！ – user3235729

@ user3235729你不應該使用'！important'。如果您需要使用'！important'，通常意味着您的CSS存在某些特別的錯誤。 –

添加important規則，以你的風格，因爲有邊界定義的另一個樣式相同的 div。爲了給您的changeColor課堂提供最高優先級，您應該使用！重要規則。

.changecolor{ 
    border: 2px solid white !important; 

}

DEMO

來源

2014-01-25 17:53:26 semirturgay

不推薦使用'！important'表示法。因爲它隱藏了真正的問題。一般來說，只有在你放棄的情況下才能使用重要的東西。 –

謝謝......從來不知道！重要。現在它完美的工作。 – user3235729

@AndréSnedeHansen你完全正確，但如果用戶想要與具有不同ID的其他div一起使用該類，該怎麼辦？ – semirturgay

爲什麼我的addClass不起作用？

回答

相關問題