jquery - xóa lớp học dựa trên điều kiện

Question

Tôi đang bỏ phiếu phản hồi json trong mỗi 1 phút và dựa trên phản hồi tôi đang thêm hoặc xóa lớp phủ trên trang của mình. Phản hồi của tôi phần lớn thời gian tích cực, trong trường hợp này, tôi nên xóa lớp phủ. Trong đoạn mã dưới đây, một phần khác đang thực thi mỗi lần và loại bỏ các hàm lớp và ẩn được thực thi mỗi lần. Có cách nào để tránh điều này không. Có phương pháp nào trong jquery để kiểm tra xem lớp được thêm vào hay không. Cũng ẩn là hoạt động hay không. Hoặc bất cứ ai có thể đưa ra cú pháp để đạt được điều này bằng cách thiết lập và hủy đặt biến boolean.

(function poll() { 
    setTimeout(function() { 
    $.ajax({ 
     url: "path", 
     type: "GET", 
     success: function(data) { 
     console.log("polling" + data); 
     if (data.is_running === true) { 
      $("#overlay").addClass('show'); 
      $("#alertDiv").show(); 
     } else { 
      console.log("removing ...."); 
      $("#overlay").removeClass('show'); 
      $("#alertDiv").hide(); 

     } 
     }, 
     dataType: "json", 
     complete: poll, 
     timeout: 200 
    }) 
    }, 5000); 
})(); 

Answer 1

Bạn có thể kiểm tra xem một phần tử có một lớp học cụ thể với hasclass():

var overlay = $('#overlay'); 

if (overlay.hasClass('show')) { 
    overlay.removeClass('show'); 
} 

Nhưng bạn có thể sử dụng toggle() và toggleClass(), xem Pranav's answer.

Answer 2

Bạn có thể sử dụng toggle() và toggleClass() với giá trị Boolean không cần if...else tuyên bố nếu không thì trả false

$("#overlay").toggleClass('show',data.is_running); 
$("#alertDiv").toggle(data.is_running); 

Và để kiểm tra xem một yếu tố có một lớp hay không bạn có thể sử dụng hasClass() mà trả về true nếu các yếu tố phù hợp được chỉ định cho một lớp nhất định

Answer 3

Hãy thử như dưới đây và giữ $() query methods trong biến để làm cho hiệu quả!

var $overLay = $("#overlay"), 
    $alertDiv = $("#alertDiv"), 
    sh = 'show'; 

if (data.is_running === true) { 
    $overLay.addClass(); 
    $alertDiv.show(sh); 
} else if ($overLay.hasClass(sh)) { 
    $overLay.removeClass(sh); 
    $alertDiv.hide(); 
} 

Answer 4

Tôi nghĩ rằng bạn đang nhận được data.is_running là "true"

Vui lòng thay đổi mã của bạn như phương pháp hasClass

if (data.is_running == true){ 
    //your code 
} 
or 
if (data.is_running == "true"){ 
    //your code 
}