Accessing Parameters *and* Events in function from jQuery Event

▼魔方 西西 提交于 2020-01-12 10:14:05

问题


This is a follow-up question to a different question I asked not too long ago. Typically, you can access an event in a function call from a jQuery event like this:

$item.live("click", functionToCall);

and in the function:

function functionToCall(ev) {
  // do something with ev here, like check 'ev.target'
}

But what if I wanted to send a parameter to functionToCall() and access the event? So something like this, maybe? :

$item.live("click", functionToCall($(this));  // send over parameter this time

and

function functionToCall(ev, $clickedItem) {
  // both accessible here?
  alert(ev.type);
  alert($clickedItem.attr('id'));
}

Would that be acceptable, or is there a different way to send a parameter? Because this way doesn't seem right to me. Any help would be appreciated. Thanks.

CLARIFICATION: I realize that an anonymous callback function would allow me to access both, but for various reasons too lengthy to get into in this post, I need to use a function call rather than the anonymous function. So my question deals strictly with the scenario when an external function needs to be called. Thanks.

UPDATE: My original question presented the scenario of needing to pass $(this) as a parameter to the external function. As it turns out, $(this) will be accessible in the function without even needing to pass it, because of the way jQuery reassigns values to "this" based on events. So performing this code should work for my original question:

$item.live("click", functionToCall);

and

function functionToCall(ev) {
  alert(ev.type);
  alert($(this).attr('id'));  // display id of item that was clicked
}

However, as others have answered, there is a different scenario that involves needing to pass a different kind of variable over as a parameter, such as a simply string or int. In this case, as others have notes, it becomes more complicated. But there do seem to be sufficient answers here to satisfy this second scenario (namely, "currying"). Thanks.


回答1:


You can curry or partially apply your function:

Something like this:

function functionToCall($clickedItem) {
  return function (ev) {
    // both accessible here
    alert(ev.type);
    alert($clickedItem.attr('id'));
  }
}

Then you can use it like you want:

$item.live("click", functionToCall($(this)); 

Note: If you can't modify your original functionToCall because is "external", you can wrap it:

function wrapFunctionToCall($clickedItem) {
  return function (ev) {
    // call original function:
    functionToCall(ev, $clickedItem);
  }
}
// ...
$item.live("click", wrapFunctionToCall($(this));



回答2:


.live('click', functionA(prm) {
   return function(ev) {
     // here you can use the prm and the event
  }
}



回答3:


I know the question's answered, but for what it's worth, here's a one-liner that works as well if you don't want to edit your original function(s):

$item.live("click", function() { functionToCall( $(this) ); });


来源:https://stackoverflow.com/questions/1798828/accessing-parameters-and-events-in-function-from-jquery-event

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