如何在jQuery/javascript中设置一个监听器来监控文本框中的值是否已更改？

Question

如何在jQuery/javascript中设置一个监听器来监控文本框中的值是否已更改？通过连接到平板电脑的条形码扫描仪将值输入文本框,因此每次扫描项目时,文本框中的值都会发生变化.我需要根据文本框中的值显示一些信息.

Answer 1

这取决于扫描仪输入值的方式,以及输入值后扫描仪软件的功能.

如果扫描仪textarea在输入值后关闭焦点,您可以执行以下操作:

$('yourTextarea').bind('change', function () {
    alert("Changed to " + $(this).val());
});

如果它没有取消焦点,你将不得不监视按键,并在一段时间不活动后作出反应.

$('yourTextarea').bind('keypress', function () {
    var self = $(this);

    clearTimeout(self.data('timeout'));

    self.data('timeout', setTimeout(function() {
        alert("Changed to " + $(this).val());
    }, 500));
});

您的扫描仪也可以模拟pastetextarea中的事件;

$('yourTextarea').bind('paste', function () {
    var self = $(this);

    setTimeout(function () {
        alert("Changed to " + self.val());
    }, 1);
});

您将能够试验您的扫描仪以查看它使用的方法(或者如果您懒惰则实施所有方法).

请注意,这篇文章是在2010年5月写回来的,当时最新版本的jQuery是1.6.1; 从那以后,bind()一直被取而代之on().如果您使用的是版本的jQuery> 1.7,更改所有出现bind到on在上面的代码.

Answer 2

实际情况是,jQuery中的"更改"事件在所有浏览器中并不总是可行的,一些较旧的事件不能正确处理事件.我在许多项目中遇到过这个问题,通常需要绑定到textarea的一些属性来捕获用户交互.如果它是文本类型的输入区域,它可以更简单,但通常您需要使用一些事件监听器来覆盖您的基础.

我会看看一些正在做字符计数器的人如何编写代码来收听textarea的值,然后将代码设置为

试着掩盖你的基础,也许尝试这样的事情:

$('#textareatextID').bind('keyup click blur focus change paste', function() {
    alert($(this).val());
});

这也让你不得不设置定时器,因为我不知道条码扫描器用来改变textarea值的方法,我的建议是相当广泛的.

Answer 3

怎么样：

$('#textbox').change(function()
{
    alert($(this).val());
});