JavaScript if-elseif-statement

Question

PHP에서 if-elseif 시나리오에 따라 서로 규칙이 바뀌었지만 맞습니까? 나는 약간 혼란 스럽다. 왜 이것이 JavaScript의 경우가 아닌지 알아낼 수 없다. 아무도 나에게 이것을 단순화하는 방법을 말할 수 있습니까?

(이 문장은 라디오 버튼에 연결되어 있으며 선택한 라디오 버튼의 스타일을 다르게 지정해야합니다. 그러나 모든 remove 파트를 포함하지 않을 경우 하나를 클릭 한 다음 다른 하나를 클릭하면 스타일이 적용됩니다. "selected"로 표시)

Answer 1

내가 Katana314 당신이 요구하고 질문에 올바른 대답을했다 @ 생각입니다. Javascript는 각 호출에서 페이지를 새로 고치지 않으므로 클래스를 제거 할 때까지 클래스에 남아 있습니다. 이 방법으로 조금 더 깨끗해질 수도 있습니다 ...

$("#item-upload-form input").on("change", function() { 


var hello = $("input[name='category_select']:checked", "#item-upload-form").val(); 

// find any element that has the selected class and remove it 
$('.selected').removeClass('selected'); 

// then add it to which ever element needs it. 
if(hello == 1){ 
    $("#handy").addClass("selected"); 
} else if (hello == 2){ 
    $("#pc").addClass("selected"); 
} else if (hello == 3){ 
    $("#notebook").addClass("selected"); 
} 

}); 

Answer 2

두 개의 선택기를 사용하고 있기 때문에 두 값이 같은 값을 반환하는 경우에만 값을 사용하여 hello를 확인할 수 있습니다. 두 선택기 값의 결과가 서로 다른 경우 조건이 일치하지 않습니다.

따라서 두 값이 같은 경우에만 일치합니다.

Answer 3

질문에 답하기 위해 if-else-blocks은 일치하는 항목을 찾으면 평가를 중단합니다.

제안 1 : == 대신 ===을 사용해보세요. ===은 값과 유형이 같은지 검사합니다.

== 1은 '1' == 1 및 true == 1을 비롯한 많은 항목에서 true로 전달됩니다. 나는 진짜로 안녕하세요가 무엇인지 모르지만 거짓 긍정을 얻고 있을지 모릅니다.

제안 2 : 여기 은 (대신 경우 - 다른 블록) 수정 코드를 제안

$("#handy").toggleClass("selected", (hello === 1)); 
$("#pc").toggleClass("selected", (hello === 2)); 
$("#notebook").toggleClass("selected", (hello === 3)); 

Answer 4

addClass() 만 호출하면됩니다. 코드는 다음과 같습니다.

if(hello == 1){ 
    $("#handy").addClass("selected"); 
} else if (hello == 2){ 
    $("#pc").addClass("selected"); 
} else if (hello == 3){ 
    $("#notebook").addClass("selected"); 
} 

라디오 버튼을 클릭하면 어떻게됩니까? R : 매 분기마다 하나의 분기 만 실행합니다. 연속 클릭은 현재 요소에 addClass 만 적용하고 이전 요소의 클래스는 유지 관리합니다.

Answer 5

왜 jQuery를 당신을 위해 모든 작업을 수행 - 당신은 당신의 코드를 업데이트하지 않고 선택 항목을 추가/제거 할 수 있습니다이 방법 :

$("#item-upload-form input").on("change", function (ele) { 
    $("#item-upload-form input").each(function() { 
     if ($(this).prop('checked')){ 
      $(this).addClass("selected") 
     } else{ 
      $(this).removeClass("selected") ; 
     } 
    }); 
});