When calling a Javascript function, how do I set a custom value of “this”?

随声附和 提交于 2019-12-07 04:51:34

问题


I'm using jQuery and I have a function that serves as an event callback, and so in that function "this" represents the object that that captured the event. However, there's an instance where I want to call the function explicitly from another function - how do I set what "this" will equal within the function in this case?

For example:

function handleEvent(event) {
    $(this).removeClass("sad").addClass("happy");
}

$("a.sad").click(handleEvent); // in this case, "this" is the anchor clicked

function differentEvent(event) {
    $("input.sad").keydown(e) {
        doSomeOtherProcessing();
        handleEvent(e); // in this case, "this" will be the window object
                        // but I'd like to set it to be, say, the input in question
    }
}

回答1:


Use apply call.

handleEvent.call(this, e);



回答2:


Just parameterize the function you're interested in:

function doStuff(el) {
    $(el).removeClass("sad").addClass("happy");
}

function handleEvent(event) {
    doStuff(this);
}

$("a.sad").click(handleEvent); // in this case, "this" is the anchor clicked

function differentEvent(event) {
    $("input.sad").keydown(e) {
        doSomeOtherProcessing();
        doStuff(this);
    }
}



回答3:


Use

e.target



回答4:


I'd advice you re-factoring your function as a jQuery plugin.

But here's a quick Fix:

handleEvent.apply(this,e) //transfers this from one scope, to another



回答5:


If you're simply looking to call a single event handler as if it were being triggered normally, apply/call will work fine. However, depending on your needs, it may be more robust to use the zero-argument version of jQuery's click() function, which will trigger all click handlers for that element:

function differentEvent(event) {
    $("input.sad").keydown(e) {
        doSomeOtherProcessing();
        $(this).click(); // simulate a click
    }
}


来源:https://stackoverflow.com/questions/915587/when-calling-a-javascript-function-how-do-i-set-a-custom-value-of-this

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!