为什么我的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不起作用？

回答

相关问题