Jquery : 양식 항목에서 CSS를 업데이트하십시오.

Question

jQuery를 처음 사용하고 "너비"라는 양식에서 입력 상자를 갖고 싶습니다. 값을 입력하면 (즉, "300"이라고 말하면) div "#box"를 너비 300px로 조정합니다.

감사합니다.

Answer 1

$("#txt1").bind("keypress", function(){ 
    var val = parseInt($(this).val(), 10); 
    $("#box").css({'width': val + 'px'}); 
}); 

Answer 2

편도 입력 값의 변화는, 입력 폭을 사용 #box CSS의 특성을 기본적으로 설정

jQuery("#input").change(function(){ 
    jQuery("#box").css("width", jQuery("#input").val()); }); 

.

Answer 3

$("textbox").blur(function() { 
    $("#box").css("width") = $("textbox").val(); 
}); 

Answer 4

// blur is triggered when the focus is lost 
$("#my_input_field_id").blur(function() { 
    var newWidth = $(this).text(); 
    $("#box").width(newWidth); // the width function assumes pixels 
    // alternately, use .css('width', newWidth); 
}); 

이 사용자 유형, 다음 바인딩 (그들은 500를 입력하면 그래서, 그것은 5 5 50 0 추가, 최종 0에서 500에 업데이트)로 작업 할 경우 키 누르기 이벤트.