jQuery addClass 및 removeClass in else 문이 작동하지 않습니다.

Question

그래서 테두리가있는 클래스를 만들었습니다. 국경 수표 (border-check). 이 테두리는 td.k-editable-area에 값이없는 경우에만 표시해야합니다 (텍스트 영역에는 아무 것도 쓰지 않습니다).

첫 번째 줄에 클래스를 추가 할 수 있지만 일단 if else 문을 추가하면 클래스가 추가되지 않습니다. 그래서 클래스를 다시 추가하거나 if else 문을 잘못 사용하는 문제가 정확하게 설명되어 있지 않은지 확실하지 않습니다.

$("td.k-editable-area").addClass("border-check"); 

if ("td.k-editable-area" == "") { 
    $("td.k-editable-area").addClass("border-check"); 
} else { 
    $("td.k-editable-area").removeClass("border-check"); 
} 

Answer 1

여기 OP를 통해 도움을 얻었습니다. 감사합니다! 올바른 코드였다 경우

는

function onEditorChange(e) { 
      var text = e.sender.body.innerText; 

      if (text.trim() === "") { 
       $("td.k-editable-area").addClass("border-check"); 
      } else { 
       $("td.k-editable-area").removeClass("border-check"); 
      } 
     } 

Answer 2

if 문은 두 개의 다른 문자열을 비교합니다.

"td.k-editable-area" == "" //false 

그것은 요소 $("td.k-editable-area")에서 값을 복용되지 않으므로 확인이

if ($("td.k-editable-area").text().trim() == "") { 

편집

이 여러 검사 후 td의

$("td.k-editable-area").each(function(){ 
    var $this = $(this); 
    if ($this.text().trim() == "") { 
     $this.addClass("border-check"); 
    } else { 
     $this.removeClass("border-check"); 
    } 
}) 

해야하는 경우

Answer 3

당신의 상태가 당신이 원하는 것이 아닌 두 개의 문자열을 테스트하고있다.

당신의 목표는 특정 하나가 비어 있는지에 따라 그 td의 각에 클래스를 추가/제거 할 경우, 당신은 루프가 필요합니다 :

$("td.k-editable-area").each(function() { 
    var $this = $(this); 
    $this.toggleClass("border-check", !$this.text().trim()); 
}); 

을 당신은 할 수 없습니다 만 그들은 모든 빈을하든 그 에 기반으로하는 모든 요소를 클래스를 업데이트하기 때문에

// NOT THIS 
$("td.k-editable-area").toggleClass("border-check", !$("td.k-editable-area").text().trim()); 

... 사용합니다. (다른 jQuery 접근자를 사용하면 첫 번째 것을 기반으로하지만 text은 이상합니다.)