javascript - jQuery 监听所有文本输入变化

标签 javascript jquery html forms events

我在表单中有一个输入元素,我希望能够在值更改时提取它的值。看看这个 fiddle :http://jsfiddle.net/spryno724/WaBzW/1/ .

通过使用 change 事件,我可以在输入失去焦点时显示来自文本输入的值。但是,当重置表单或当 JavaScript 清除文本输入的值时,该值不会更新。

当对文本输入控件进行任何更改时,是否有我可以监听的特定事件?

我想避免变通方法,例如监听何时重置表单或何时按下清除按钮。这是我的应用程序功能的简化示例,如果我尝试执行所有这些操作,它会很快变得疯狂。

感谢您的宝贵时间。

最佳答案

$(document).ready(function() {
    $('input.clear').click(function() {
        $('input.input').val('');
        $('p.display').text('The value of the text input is: ');
    });

    $('input.input').on('keyup change', function() {
       $('p.display').text('The value of the text input is: ' + $(this).val());
    });
})​

DEMO 1

这个解决方案可能对您有帮助:

$(document).ready(function() {
    $('input.clear, input[type=reset]').on('click', function() {
        $('input.input').val('').change();
        $('p.display').text('The value of the text input is: ');
    });

    $('input.input').on('keyup change', function() {
        $('p.display').text('The value of the text input is: ' + $(this).val());
    });
});​

DEMO 2

关于javascript - jQuery 监听所有文本输入变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10779076/

相关文章:

javascript - 如何动态设置 Angular 下拉值?

javascript - 伪代码中的 "!"是什么意思?我知道 "!"代表阶乘,但我无法翻译它

javascript - 在 PowerPoint 中,有两个动画,分别称为 "faded zoom"和 "bounce"。如何将这些相同的动画应用到我网站上的图像?

javascript - 更新多条目表的特定行

html - div元素往下跳

javascript - 有效的 Javascript 片段无法在 codepen 或 jsfiddle 上运行?

javascript - Mixpanel track_links 不适用于动态添加的元素

javascript - JQuery 升序和降序排序(不是表格)

javascript - 调查问卷“下一步”按钮的逻辑?

asp.net - Ajax 更新后在 jQuery 中重新绑定(bind)事件 (updatepanel)