Я новичок в jQuery, и я хочу иметь окно ввода из формы, называемой «ширина», и когда вы вводите значение (скажем, «300»), оно мгновенно обновляет div "#box" до ширины 300 пикселей.JQuery: обновить css из записи формы
Спасибо!
$("#txt1").bind("keypress", function(){
var val = parseInt($(this).val(), 10);
$("#box").css({'width': val + 'px'});
});
Один из способов:
jQuery("#input").change(function(){
jQuery("#box").css("width", jQuery("#input").val()); });
В основном, когда изменения входной величины, установите атрибут CSS из #box использовать ширину входного сигнала.
$("textbox").blur(function() {
$("#box").css("width") = $("textbox").val();
});
// 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 добавляется, то 500 на конечный 0), затем связать к событию нажатия клавиши.
Вопрос любопытства - почему parseInt? Просто для обеспечения типоразмеров? – justkt
Любой способ заставить этот скрипт работать при вводе значения? У меня есть ползунок, подключенный к блоку ввода ширины, поэтому, когда слайдер изменил значение, я хочу, чтобы #box изменялся одновременно. – floatleft
@Chat Whitaker - Этот ответ должен сделать это. Это привязка к keypress. Вы также можете связывать через $ ("# txt1"). Keypress (function() {...}); Документы jQuery дают больше информации http://api.jquery.com/keypress/. – justkt