Переключить классы с запросом на основе ответа ajax

Question

Я использую вызов ajax для моего файла functions.php для запроса БД и выяснения, является ли поле «is_recurring» равным 1 или 0. 1 или 0 происходит от выпадающий выбор. Основываясь на том, что возвращается из функции php, я пытаюсь добавить и удалить класс «hide» из моего div, где отображается какой-то текст.

Есть ли лучший способ написать этот код? Кроме того, если я выбираю выпадающее меню взад и вперед несколько раз, он, похоже, запутывается и не добавляет/удаляет класс правильно. Любые предложения будут ценны.

var request = $.ajax({ 
    type: "POST", 
    url: 'inc/functions.php', 
    data: {action: "toggle", category:category} 
}); 
request.done(function(response){ 
    if(response == 1) { 
     if($('#toggle').hasClass("hide")) { 
      $('#toggle').hide().removeClass("hide").fadeIn(900);  
     } else { 
      $('#toggle').fadeOut(900).addClass("hide"); 
     }; 
    } else if(response != 1) { 
     if($('#toggle').hasClass("hide")) { 
      exit;   
     } else { 
      $('#toggle').fadeOut(900).removeClass("hide"); 
     }; 
    }; 
}); 

Answer 1

Лучший способ, чтобы не пересечь DOM много раз:

request.done(function(response){ 
    var ele = $('#toggle'); 
    if(response == 1) { 
     if(ele.hasClass("hide")) { 
      ele.hide().removeClass("hide").fadeIn(900);  
     } else { 
      ele.fadeOut(900).addClass("hide"); 
     }; 
    } else if(response != 1) { 
     if(ele.hasClass("hide")) { 
      exit;   
     } else { 
      ele.fadeOut(900).removeClass("hide"); 
     }; 
    }; 
}); 

Answer 2

Try:

if(response == 1) { 
    $('#toggle').removeClass('.hide').fadeIn(); 
} 
else{ 
    $('#toggle').addClass('.hide').fadeOut(); 
} 

Answer 3

Это код, который я закончил с использованием на основе @ предложение Тяги, в с несколькими изменениями.

request.done(function(response){ 
    var ele = $('#toggle'); 
    if(response == 1) { 
     if(ele.hasClass("hide")) { 
      ele.hide().removeClass("hide").fadeIn(900);  
     } else { 
      exit; 
     }; 
    } else if(response != 1) { 
     if(ele.hasClass("hide")) { 
      exit;   
     } else { 
      ele.fadeOut(900).addClass("hide"); 
     }; 
    }; 
});