Question

我有一个手风琴，当它被点击（整个元素）时，它会触发并显示内部项目。我希望能够在其中一个内部项中添加一个手风琴，所以我使用event.target来查看点击发生的位置。出于某种原因，event.target检测到内部段落上的点击，但没有检测到它的包装div？这是什么原因？

$(".gestion-accordion-wrap").on("click", function(event){

      var $target = $( event.target );

      if ( $target.is ( $(".gestion-inner-wrap p") ) ){

        var $innerWrap = $(".gestion-inner-wrap p").parent().parent();

        $innerWrap.children().eq(1).slideToggle(300); 
        $innerWrap.find(".mas-detalles-clickable-inner").toggleClass("clickable-spin");
        $innerWrap.find(".mas-detalles-after-inner").toggle();
        $innerWrap.find(".menos-detalles-after-inner").toggle();

        $innerWrap.find(".span-left-line").toggleClass("left-line-grow");

      } else {

  $(this).children().eq(1).slideToggle(300); 
  $(this).find(".mas-detalles-clickable").toggleClass("clickable-spin");
  $(this).find(".mas-detalles-after").toggle();
  $(this).find(".menos-detalles-after").toggle();
  $(this).find(".span-left-line").toggleClass("left-line-grow");
}})

为什么检测到这种情况：

if ( $target.is ( $(".gestion-inner-wrap p") ) ){

但不是吗？

if ( $target.is ( $(".gestion-inner-wrap") ) ){

（注意：此选择器中没有p）

Answer 1

这是DOM的工作方式！。

target属性仅用于匹配发生给定事件的确切元素，捕获事件的处理程序无关紧要。您需要的是 currentTarget 属性。

<强> currentTarget当前

在事件遍历DOM时标识事件的当前目标。它始终引用事件处理程序附加到的元素，而不是event.target，它标识事件发生的元素。

$(".gestion-accordion-wrap").on("click",'*',  function(event){

  var $target = $( event.currentTarget );
  alert( $target.is ( $(".gestion-inner-wrap") ) ); // TRUE

}

https://jsfiddle.net/mbzp2xcp/

使用event.target检测内部div的点击

1 个答案: