jQuery'if .change（）或.keyup（）'

80

使用jQuery我想无论何时运行功能.change()或.keyup()升高。

这样的事情。

if ( jQuery(':input').change() || jQuery(':input').keyup() )
{
    alert( 'something happened!' );
}

编辑

对不起，我忘了提。双方.change()并.keyup()需要一些变量是在范围内。

javascript jquery function

— cnotethegr8
source

2

事件不是“活动的”，而是引发的。

— StuperUser 2011年

need some of the variables to be in-scope您是指事件中的变量还是注册这些事件处理程序时使用的变量？您可以在event参数（通常名为e）中获取事件变量，否则可能需要将它们保留在窗口级别或元素上的数据中，直到引发事件或查看闭包为止。

— StuperUser 2011年

188

您可以将多个事件用空格隔开来绑定它们：

$(":input").on("keyup change", function(e) {
    // do stuff!
})

docs在这里。

希望能有所帮助。干杯！

— 基甘瓦特金斯
source

7

请注意，如果在keyup上更改值，则内部函数将被调用两次（因此，几乎总是被调用）。请参阅@Joshua Burns回复以进行处理。

— T30 2015年

但是它执行两次“ keyup”一次，一次“ change” ...为什么？

— 拉胡尔·帕瓦尔

6

应该使用.on（）而不是.bind（）

— StefanBob

22

如果您要动态生成页面内容或通过AJAX加载内容，则以下示例实际上是您应该采用的方法：

在脚本多次加载的情况下（例如在AJAX请求中），它可以防止双重绑定。
绑定body位于文档的上，因此无论添加，移动，删除和重新添加了哪些元素，body匹配指定选择器的所有后代都将保留正确的绑定。

编码：

// Define the element we wish to bind to.
var bind_to = ':input';

// Prevent double-binding.
$(document.body).off('change', bind_to);

// Bind the event to all body descendants matching the "bind_to" selector.
$(document.body).on('change keyup', bind_to, function(event) {
    alert('something happened!');
});

请注意！我正在使用的$.on()和$.off()，而不是其他的方法有以下几个原因：

$.live()并且$.die()已弃用，并已从jQuery的最新版本中省略。
我最好要么需要定义一个单独的函数（因此弄乱全球范围内，），并通过该函数既$.change()和$.keyup()分开，或通过相同的函数声明调用每个函数; 复制逻辑...这绝对是不可接受的。
如果曾经将元素添加到DOM，$.bind()则在创建元素时不会动态绑定到元素。因此，如果您绑定到:inputDOM，然后将输入添加到DOM，则该bind方法不会附加到新输入。然后，您需要显式取消绑定，然后重新绑定到DOM中的所有元素（否则，您将得到重复的绑定）。每次将输入添加到DOM时，都需要重复此过程。

— 约书亚伯恩斯
source

第二行是做什么的？

— Varun

@VarunDas，var bind_to = ':input';创建一个名为变量bind_to这是抓住所有的输入类型，例如选择input，textarea和button。

— Joshua Burns

如果我想要特定的元素：var bind_to = '#myInput';ajax调用无论如何都要执行两次。为什么？？？

— Pathros

@Pathros我需要看一个例子，这个地方不在那儿。拍我在LinkedIn或某事的消息

— 约书亚伯恩斯

3

做这个。

$(function(){
    var myFunction = function()
    {
        alert("myFunction called");
    }

    jQuery(':input').change(myFunction).keyup(myFunction);
});

— 布伦特
source

change()并keyup()返回包装好的集合，因此您可以将其链接起来。

— StuperUser 2011年

你可以，不是吗。谢谢。

— brenjt 2011年

该链还消除了通过DOM进行的第二个查询。

— keeganwatkins 2011年

2

您可以订阅change和keyup事件：

$(function() {
    $(':input').change(myFunction).keyup(myFunction);
});

myFunction您要执行的功能在哪里：

function myFunction() {
    alert( 'something happened!' );
}

— 达林·迪米特罗夫（Darin Dimitrov）
source

1

事件不是这样工作的。而是给它们一个函数，让它们在发生时被调用。

$("input").change(function() {
    alert("Something happened!");
});

— 亚历克斯·特平
source

0

编写一个函数，并为两个函数都调用它。

function yourHandler(e){
    alert( 'something happened!' );        
}
jQuery(':input').change(yourHandler).keyup(yourHandler);

change（）和keyup（）事件注册函数返回原始集合，因此可以链接它们。

— StuperUser
source

0

keyup事件输入jQuery

对于演示

$(document).ready(function(){  
    $("#tutsmake").keydown(function(){  
        $("#tutsmake").css("background-color", "green");  
    });  
    $("#tutsmake").keyup(function(){  
        $("#tutsmake").css("background-color", "yellow");  
    });  
});

<!DOCTYPE html>  
<html>  
<title> jQuery keyup Event Example </title>
<head>  
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>  
<body>  
Fill the Input Box: <input type="text" id="tutsmake">  
</body>  
</html>

展开摘要

— 开发者
source

即使OP正在寻找组合的

— 按键