Question

我的核心问题如下：

$('input').click (e) ->
  # do some things conditionally, depending on the event origin
  false

$('a').click ->
  $('input').click()

所以问题是，我怎么知道是谁开始了这个活动。

请注意，在这两种情况下（点击输入或链接e.target都相同）。

更新：我在上面发布了上面的代码：http://jsfiddle.net/w7faW/1/

感谢。

Answer 1

您可以将额外参数传递给事件处理程序[1]：

$('input').click (e, triggered) ->
  if triggered then x
  false

$('a').click ->
  $('input').trigger('click', true)

这允许您使用额外参数来标识点击的来源（用户启动或编程），从锚点击中继e.target，或将数据发送到事件处理程序。

[1] http://api.jquery.com/trigger/

Answer 2

$('input').click (e) ->
      if $(@).data 'triggeredBy'?
          #do something         
      false

$('a').click (e) ->
    $('input').data 'triggeredBy', e.target
    $('input').click()

可能有一种方法可以将之前的目标保存到实际的事件对象，但我还是会保存到jQuery数据属性，只是为了更容易理解。在触发之前，基本上将触发器连接到触发器。这样你就可以在事后得到它。

如果您需要更具体地说明触发器（您有多个对象触发相同的事件），您可以执行以下操作：

更新圆形旅行的自定义事件

input = $('input')
thingyOne = $('#thingyOne')
thingyTwo = $('#thingyTwo')

input.on 'inputClick', (e, triggerer) ->
      that = $(@)
      if triggerer.is thingyOne
          #do something         
      else triggerer.is thingyTwo
          #do something else
      else triggerer.is that
          #do something if triggerer and triggeree are the same
      false

attachAndTrigger = (triggerer,triggeree) ->
    triggerer.on 'click', ->
        triggeree.trigger 'inputClick', triggerer  

attachAndTrigger thingyOne, input
attachAndTrigger thingyTwo, input
attachAndTrigger input, input

Answer 3

您可以使用trigger函数以编程方式触发事件时传递参数：

$('input').click (e, target = e.target) ->
  console.log 'target:', target
  false

$('a').click (e) ->
  $('input').trigger 'click', this

我正在传递一个可选参数target，默认为e.target，当点击链接时，链接本身作为该参数传递。然后，您可以使用该参数来检查哪个是触发元素。您可以在this jsfiddle中查看不同的输出。

但是，考虑到这个简单的例子，我必须说这个解决方案可能有点令人困惑，我更喜欢使用相同的函数作为两个元素的单击处理程序（jsfiddle）：

$('input, a').click (e) ->
  console.log 'target:', e.target
  false

或者，如果你需要为每个元素做一些不同的事情，然后为两者做一些共同的事情，你可以使用另一个函数来解决这个常见的行为：

$('input').click (e) ->
  # Do something special for the input.
  commonClickHandler this, e

$('a').click (e) ->
  # Do something special for the link.
  commonClickHandler this, e

somethingCommon = (element, event) ->
  # Do something common for both elements.

Answer 4

抱歉，我不知道咖啡脚本，但这应该告诉你触发了什么元素，如果你想了解更多关于元素的信息，你可以检查它们的属性，如类或ID。

$('a').click(function(e) {
    var target = e.target,
        $target = $(target);

    console.log( 'This element is: ' + target.nodeName );    
    console.log( 'This class is: ' + $target.attr('class') );
    console.log( 'This ID is: ' + $target.attr('id') );
});

获取触发元素

4 个答案: