input(select) 박스에 값이 입력된 뒤 배경색 변경하기 정보
input(select) 박스에 값이 입력된 뒤 배경색 변경하기본문
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); /* 입력값이 지워지면 기본배경색으로 */
});
});
3