자바 스크립트에서 if 문 내의 변수 값을 변경하십시오.

Question

코드 조각에 문제가있어 견과류가되었습니다. 나는 이것을 몇 시간 동안 붙들어 왔으며, 최악의 부분은 그것이 정말로 간단하다고 가정하고 있다는 것입니다. 나는 그것을 이해할 수 없다.

Javascript/jQuery를 사용하여 간단한 이벤트 캘린더를 만들려고합니다. 이제

var currentMonth = 1; 
if (currentMonth == 1) { 
    $("#prev-month").click(function() { 
     currentMonth = 12; 
    }); 
    $("#next-month").click(function() { 
     currentMonth = 2; 
    }); 
} 
if (currentMonth == 2) { 
    $("#prev-month").click(function() { 
     currentMonth = 1; 
    }); 
    $("#next-month").click(function() { 
     currentMonth = 3; 
    }); 
} 
if (currentMonth == 3) { 
    $("#prev-month").click(function() { 
     currentMonth = 2; 
    }); 
    $("#next-month").click(function() { 
     currentMonth = 4; 
    }); 
} 
if (currentMonth == 4) { 
    $("#prev-month").click(function() { 
     currentMonth = 3; 
    }); 
    $("#next-month").click(function() { 
     currentMonth = 5; 
    }); 
} 

이 때마다 내가 ID "다음 달"로 버튼을 클릭 내가 ID를 가진 버튼을 클릭하면, 항상 2입니다 "이전 개월이 내가 가진 그 단순화 된 코드입니다 ", 항상 12입니다. 결코 바뀌지 않습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

Answer 1

스크립트 코드는 한 번만 실행됩니다. 클릭 핸들러를 클릭 한 후에는 클릭 핸들러를 변경하지 않으므로 해당 핸들러는 항상 동일한 결과를 제공합니다.

하지만 각 단추에 대해 단일 처리기를 사용하고 런타임에 변경하는 12 개의 처리기 대신에 산술을 사용하여 다음/이전 달을 계산하는 것이 더 간단 할 것이라고 수정하는 대신.

$("#prev-month").click(function() { 
    currentMonth = (currentMonth - 1) || 12; 
}); 
$("#next-month").click(function() { 
    currentMonth = currentMonth % 12 + 1; 
}); 

Answer 2

.click() 기능을 잘못 사용하고 있습니다. 이처럼해야한다 :

var currentMonth = 1; 

$("#prev-month").click(function() { 
    currentMonth--; 
    if (currentMonth == 0) { 
     currentMonth = 12; 
    } 
} 
$("#next-month").click(function() { 
    currentMonth++ 
    if (currentMonth == 13) { 
     currentMonth = 1; 
    } 
});​ 

Answer 3

당신은 당신의 참조 및 ($(this).is()를 사용하여) 하나의 클릭 핸들러를 저장하기 위해 클로저를 사용할 수 있습니다

<div> 
    Current Month: <input type="text" id="current-month"/> 
    <button id="prev-month">Previous Month</button> 
    <button id="next-month">Next Month</button> 
</div> 

$(document).ready(function(){ 
    var currentMonth = 1, 
     $currentmonth = $('#current-month'); 

    $currentmonth.val(currentMonth); 

    $("#prev-month, #next-month").click(function() { 
     var $this = $(this); 

     if ($this.is('#prev-month')) { 
      currentMonth = currentMonth - 1; 
     } else { 
      currentMonth = currentMonth + 1; 
     } 

     if (currentMonth == 0) { 
      currentMonth = 12; 
     } else if (currentMonth > 12) { 
      currentMonth = 1; 
     } 

     $currentmonth.val(currentMonth); 

     console.log('Current Month: ' + currentMonth); 
    }); 
}); 

http://jsfiddle.net/pCs2G/