jquery 输入框

jQuery 输入框操作

获取输入框的值 使用 val() 方法获取或设置输入框的值。获取值时无需参数，设置值时传入新值作为参数。

// 获取输入框的值
var inputValue = $('#inputId').val();

// 设置输入框的值
$('#inputId').val('新值');

监听输入事件 通过 on() 方法监听输入框的 input 或 change 事件，实时响应内容变化。

$('#inputId').on('input', function() {
    console.log('当前输入值:', $(this).val());
});

禁用/启用输入框 使用 prop() 方法控制输入框的禁用状态。

// 禁用输入框
$('#inputId').prop('disabled', true);

// 启用输入框
$('#inputId').prop('disabled', false);

清空输入框内容 直接调用 val('') 方法清空输入框内容。

$('#inputId').val('');

输入框焦点控制 通过 focus() 和 blur() 方法控制输入框的焦点状态。

// 聚焦到输入框
$('#inputId').focus();

// 移除输入框焦点
$('#inputId').blur();

动态创建输入框 使用 jQuery 动态创建输入框并添加到 DOM 中。

var newInput = $('<input>', {
    type: 'text',
    id: 'dynamicInput',
    placeholder: '动态创建的输入框'
});
$('#container').append(newInput);

输入框样式操作 通过 css() 方法修改输入框的样式。

$('#inputId').css({
    'border': '1px solid red',
    'padding': '5px'
});

输入框属性操作 使用 attr() 方法获取或设置输入框的属性。

// 获取属性
var placeholder = $('#inputId').attr('placeholder');

// 设置属性
$('#inputId').attr('placeholder', '请输入内容');