Question

我正在使用jQuery 1.7并且需要将相同的函数绑定到2个不同的选择器上的2个不同的直播事件，例如：

function do_something(_this){
  // do something with _this
  alert("test");
}

$("input").live("keyup", function({
  do_something($(this));
});

$("select").live("change", function({
  do_something($(this));
});

这有效，但我真的很想，如果我能以某种方式将所有这些都归结为一个陈述，例如：

// pseudo code
( $("input").live("keyup") || $("select").live("change") ).bind(function(){
  // do something with $(this)
  alert("test");
});

这可能吗？

Answer 1

您可以直接将do_something()函数放入.live()函数中，并避免使用匿名函数。这节省了一些字符。

$("input").live("keyup", do_something );
$("select").live("change", do_something );

要转换为jQuery 1.7语法，您需要使用委托（.live()为您做过）。您可以使用输入和选择元素所在的<form>或document。

$( document ).on( "keyup", "input", do_something );
$( document ).on( "change", "select", do_something );

如果你真的想把两个事件和选择器放在一个电话中，你可以。因为你无论如何都要使用相同的功能，因为你使用的是一个委托，所以总共只有两个事件。如果你真的认为你需要它，你可以检查回调中的事件，以确保正确的选择与选择器匹配（正如我在演示中所示）。

$( document ).on( "keyup change", "input, select", do_something );

演示：http://jsfiddle.net/ThinkingStiff/6ZUMa/

HTML：

<input />
<select>
    <option>1</option>
    <option>2</option>
</select>

脚本：

$( document ).on( 'keyup change', 'input, select', do_something );

function do_something( event ) {

    //this if() statement probably isn't needed for your purposes
    if( ( event.type == 'keyup' && event.target.tagName.toLowerCase() == 'input' )
      || ( event.type == 'change' && event.target.tagName.toLowerCase() == 'select' ) ) {

        //process event here
        $( 'input' ).val( event.type );

    };

};

Answer 2

$('input').on('keyup', do_something);
$('select').on('change', do_something);

请注意，从jQuery 1.7开始，不推荐使用.live()方法。使用.on()来附加事件处理程序。旧版jQuery的用户应优先使用.delegate() {。{1}}。

如果您需要.live() - 类似功能，请使用：

live()

Answer 3

$(".my_selector").live("keyup change", function({
  do_something();

}）;

如果您将类my_selectror添加到元素中，这应该有用。

Answer 4

请注意，.live方法已被严重弃用。 http://api.jquery.com/live/

从jQuery 1.7开始，不推荐使用.live（）方法。使用.on（）来附加事件处理程序。旧版jQuery的用户应该使用 .delegate（）优先于.live（）。

使用.on（）方法，您可以执行以下操作：

$("input, select").on("focusout", function(){
    alert( "focus lost on " + $(this).attr("id") );
});

使用焦点输出事件，当任何输入字段或选择项目失去焦点时（即用户已移至另一个现在处于焦点的项目），您可以执行某些操作。

2个选择器，2个不同的事件，相同的功能

4 个答案: