jQuery if/else if 문이 처음 "if"후에 작동하지 않습니다.

Question

간단한 if/else if 조건이 있지만 "if"부분 만 작동하고 "else if"부분은 작동하지 않습니다. 이유를 찾아라. 이 코드는 세 개의 목록 상자 (ajax가 채워진)를 나타냅니다.이 중 하나를 클릭하면 jQuery 함수가 클릭 된 항목의 ID를 수집하고이를 변수에 할당합니다. 첫 번째 (올바른 ID 번호를 얻은 장소를 전환하더라도) 두 번째 또는 세 번째 절대로 괜찮습니다. "if/else if"구조 대신에 "if"를 3 개 사용하면 작동하지 않습니다.

$(document).ready(function() { 
    $('#btn_edit_details').click(function() { 
     var request_id; 
     if ($('#lstbx_new_repeat_requests').val().length > 0) { 
      request_id = $('#lstbx_new_repeat_requests').val(); 
      alert(request_id); 
     } 
     else if ($('#lstbx_approved_repeat_requests').val().length > 0) { 
      request_id = $('#lstbx_approved_repeat_requests').val(); 
      alert(request_id); 
     } 
     else if ($('#lstbx_declined_repeat_requests').val().length > 0) { 
      request_id = $('#lstbx_declined_repeat_requests').val(); 
      alert(request_id); 
     } 
if ($('#btn_edit_details').val() == 'edit') { 
// rest of the code, working fine when the request_id is passed from the first "if" 

그리고 HTML

<input type='button' id='btn_edit_details' value='edit' /> 
<select id='lstbx_new_repeat_requests' name='lstbx_new_repeat_requests'></select> 
<select id='lstbx_approved_repeat_requests' name='lstbx_approved_repeat_requests'></select> 
<select id='lstbx_declined_repeat_requests' name='lstbx_declined_repeat_requests'></select> 

Answer 1

나는 당신이하지 보일 수 있지만 그렇게 똑똑, 그것은 나를 위해 일한 유일한 방법으로 끝났다, 그러나 다시 - 그것은 내가 그것을 ... 일을 할 수있는 유일한 방법입니다 그리고 난 아무 생각도 이유가 없다 정말 기본적인 if/else if 방식으로는 작동하지 않았습니다. 모든 제안이나 의견은 따뜻하게 받아 들여질 것입니다. 도움을 주신 모든 분들께 감사드립니다.

세 개의 목록 상자의 클래스는 lstbx_repeat_requests입니다. 사용자가 세 가지 항목 중 하나를 클릭하면 해당 ID를 전역 변수로 캡처합니다. 그럼 아래와 같이 switch 문을 사용

1. 캡처 아이디 :

   $(document).ready(function() { 
   $('.lstbx_repeat_requests').change(function() { 
       //assigns a global var 
       window.my_config = 
       { 
        lstbx_id : this.id 
       }; 
   }); 
   }); 
   

2. 스위치 문 :

   $(document).ready(function() { 
   $('#btn_edit_details').click(function() { 
   
       var request_id; 
       switch(window.my_config.lstbx_id){ 
        case "lstbx_new_repeat_requests":{ 
         request_id = $('#lstbx_new_repeat_requests').val(); 
         alert(request_id + " new"); 
         break; 
        } 
        case "lstbx_approved_repeat_requests":{ 
         request_id = $('#lstbx_approved_repeat_requests').val(); 
         alert(request_id + " approved"); 
         break; 
        } 
        case "lstbx_declined_repeat_requests":{ 
         request_id = $('#lstbx_declined_repeat_requests').val(); 
         alert(request_id + " declined"); 
         break; 
        } 
       } 
       //rest of the code 
   

Answer 2

this을 시도해보십시오

$('#btn_edit_details').click(function() { 
    var request_id; 
    $('select').each(function (index, value) { 
     if ($(this).val().length > 0) { 
      request_id = $(this).val(); 
      alert(request_id); 
      return; 
     } 
    }); 
}); 

Answer 3

구현 논리는 문제가있다.

초기에 사용자가 제 1 선택 목록 편집 프레스에서 1을 선택한다 :

는 다음의 경우를 고려한다.

$('#lstbx_new_repeat_requests').val()은 1이고 당신은 값 1

와 경고가 표시됩니다 이후 사용자가 두 번째 선택 목록에서 옵션 2를 선택합니다.

$('#lstbx_new_repeat_requests').val()는 $('#lstbx_new_repeat_requests').val()이기 때문에 도달 할 수없는 경우 사용자가이 값 1. 다른 와 경고가 표시됩니다 두 번째 선택 목록에서 옵션을 선택 그렇게해도 여전히 1 1 및 코드 첫 번째 경우 블록이 실행됩니다.

아래에서 위의 문제를 해결할 수있는 구현을 찾을 수 있습니다.

<input type='button' id='btn_edit_details' value='edit' /> 
<select class="select-list" id='lstbx_new_repeat_requests' name='lstbx_new_repeat_requests'> 
    <option value=''></option> 
    <option value='1'>1</option> 
</select> 
<select class="select-list" id='lstbx_approved_repeat_requests' name='lstbx_approved_repeat_requests'> 
    <option value=''></option> 
    <option value='2'>2</option> 
</select> 
<select class="select-list" id='lstbx_declined_repeat_requests' name='lstbx_declined_repeat_requests'> 
    <option value=''></option> 
    <option value='3'>3</option> 
</select>​ 

var request_id;  
$(document).ready(function() { 
    $('#btn_edit_details').click(function() { 
     alert(request_id); 
    }); 

    $('.select-list').change(function() { 
     if ($(this).val().length > 0) { 
      request_id = $(this).val(); 
     }   
    }); 
});​