Question

我有两节课：

<div class="currentWeather"></div>
<div class="weeklyWeather"></div>

我正在尝试在它们之间切换，因此每隔10秒它将显示其中一个类并隐藏另一个类，依此类推。

setInterval(function(){

$(".currentWeather, .weeklyWeather").toggleClass("currentWeather weeklyWeather");

}, 3000);

但这只是切换了类名。...切换的不是我想要的吗？

Answer 1

//CSS Class:

.mask{
    display: none;
}

//setInterval callback function to add and remove mask class
setInterval(function(){
   //You can check if the element has the class with .hasClass
   if($('.currentWeather').hasClass('mask'){
       $('.currentWeather').removeClass('mask');
       $('.weeklyWeather').addClass('mask');
   }else{
        $('.currentWeather').addClass('mask');
        $('.weeklyWeather').removeClass('mask');
   }

   //Or you can just .toggleClass
    $('.currentWeather').toggleClass('mask');
    $('.weeklyWeather').toggleClass('mask');

}, 3000);

//And your HTML would have to have one of these divs with class mask initially

   <div class="currentWeather"></div>
   <div class="weeklyWeather mask"></div>

jQuery在两个类之间切换，显示和隐藏

1 个答案: