jQuery prependTo 从 $(this) 派生的类

Question

如何在 $(this) 的具体后代中添加一个类，例如我只想添加到本例中实际单击的 div 之前...

<div>
 <div class='target'></div>
</div>

<div>
 <div class='target'></div>
</div>



$('div').click(function(){
  $('<div>hello</div>').prependTo('.target');
});

Answer 1

仅 Hook 相关的 div，然后在处理程序中使用 this (但另见下文，我可以通过两种不同的方式阅读您的问题):

$('div.target').click(function(){
  $('<div>hello</div>').prependTo(this);
});

在通过 jQuery 连接的事件处理程序中，this 指的是您将处理程序连接到接收事件的特定 DOM 元素。请参阅bind或on有关详细信息的文档。

Live example (最后的 } 和 ) 也颠倒了，导致语法错误。)

如果您的目标是单击目标 div 前面的外部 div 上的任意位置，则更像是这样:

$('div').click(function(){
  // Look for "target" divs within this div
  var target = $(this).find("div.target");

  // Did we find any?
  if (target[0]) {
    // Yes, prepend to it/them
    $('<div>hello</div>').prependTo(target);

    // And stop the event
    return false;
  }
});

Live example我们再次使用 this，但这次我们使用它来查明事件传播到的 div 是否包含 div 与“目标”类。如果是这样，我们会在您的“hello”div 前面添加并通过 return false; 停止事件(您可以使用 event.stopPropagation(); 代替)。