input 입력박스나 select 입력박스 등에 값이 입력(선택)될 경우

입력박스(select박스) 등의 배경색상을 변경하는 팁입니다.

$(function() {

  var select_bg = $("#select1").css("background"); // #select1 은 select 의 id 값 - 기존 배경색 저장
  var input_bg = $("#input1").css("background");  // #input1 은 input 의 id 값 - 기존 배경색 저장

  var submin_bg = $("input[type=submit]").css("background"); // submit 버튼의 배경색
 

  $("input").blur(function() {
   if ($(this).val()) $(this).css("background","#EEF6E2"); /* 값이 입력되면 #EEF6E2 로 변경한다 */
   else $(this).css("background",input_bg);  /* 입력값이 지워지면 기본배경색으로 */
   $("input[type=submit]").css("background",submin_bg); // submit 버튼의 배경색은 원래대로 복원
  });

  $("select").blur(function() {
   var this_id = "#"+$(this).attr('id')+" option:selected";
   if ($(this_id).val()) $(this).css("background","#EEF6E2"); /* 값이 입력되면 #EEF6E2 로 변경한다 */
   else $(this).css("background",combo_bg);  /* 입력값이 지워지면 기본배경색으로 */
  });

});