javascript - 从 2 个不同的点击事件触发相同的函数，带参数和不带参数

Question

我有一个myFunc可以通过 2 种不同方式触发的功能：通过单击 div1 或 div2。

• 如果点击来自 div2，我想在调用时将一些参数传递给函数。
• 此外，在这两种情况下，我都需要引用被点击的项目：$(this)。

我已经尝试过这段代码，但是即使我没有点击任何东西，第二个版本（我正在传递参数的地方）也会自动触发。我做错了什么，this在这两种情况下我都需要作为参数传递吗？

$('#div1').live('click', myFunc);
$('#div2').live('click', myFunc('param1 value', 'param2 value'));

function myFunc(param1, param2){
  console.log('inside myFunc');
}

Answer 1

将您的第二个live电话替换为：

$('#div2').live('click', function() {
    myFunc.call(this, 'param1 value', 'param2 value');
});

或者使用onjQuery 1.7+ 中的新方法，它被提议作为绑定处理程序的新标准：

$(document).on('click', '#div2', function() {
    myFunc.call(this, 'param1 value', 'param2 value');
});

Answer 2

您的第二行正在立即执行myFunc。相反，将其包装在一个匿名函数中：

$('#div2').live('click', function() {
    myFunc.apply(this, ['param1 value', 'param2 value']);
});

您需要使用apply或call保留原始上下文（否则thisinmyFunc将是全局窗口对象而不是单击的元素）。

Answer 3

我相信您最好将匿名函数作为第二个处理程序传递，并在其中根据需要调用“myFunc”。

例子：

$('#div1').live('click', myFunc);
$('#div2').live('click', function() {
  myFunc.call(this, 'param1 value', 'param2 value');
});

Answer 4

不要使用live，它现在已弃用。改为使用。

datajQuery 提供了一种在事件发生时传递的简单方法。这应该是标准的方式，

$(document).ready(function() {  
    $("body").on("click","#div1", {param1: "param1",param2: "param2"},myFunc);
    $("body").on("click","#div2",myFunc);
    function myFunc(event){
        console.log(this.id);
        if(this.id == 'div1'){
            console.log(event.data.param1);
            console.log(event.data.param2);
        }
    }

});

编辑：

我不知道你的上下文或要求是什么，但我会这样编码，

$("body").on("click","#div1,#div2",function(){
    if(this.id == 'div1'){
         // the code for div1, use your params here.   
    }
    else{
        // the code for div2
    }
});

Answer 5

你不能这样做。您必须定义一个内联函数，并从中调用 myFunc。

$('#div1').live('click', myFunc);
$('#div2').live('click', function(){ return myFunc('param1 value', 'param2 value'); } );