Question

当我点击div中的子元素（'butMedWhite'类）时 - jquery认为我点击了父元素（'.alternative'） - 即使我在控制台中转储'this'它说我点击了课程'替代'（见下面的代码） - 而不是'butMedWhite'课程 - 有没有人有任何想法为什么？这是html：

<div class="alternative _activeCategory">
    <div class="alternative_inner"></div>
    <div class="expandable" style="display: block;">
        <div class=" criteriaContainer">
            <a class="butMedWhite altCreator">add rule</a>
        </div>
    </div>
</div>

这里是jquery：

$('.altExpander').on('click', '.alternative', function(e) {
                    console.log(this);
                    if(!$(this).hasClass('_activeCategory')){
                        expandCategory($(this));
                    }else{
                        closeCategory();
                    }
                });

感谢您的帮助！

Answer 1

jQuery为您的回调提供了绑定事件处理程序的元素，就像本机DOM函数一样。

如果您想要点击的元素，请不要使用this，而是使用e.target：

$('.altExpander').on('click', '.alternative', function(e) {
     var clicked = $(e.target);
     console.log(clicked);
     if(!clicked.hasClass('_activeCategory')){
            expandCategory(clicked);
     }else{
            closeCategory();
     }
});

Answer 2

那是因为你的选择器在这一行中是“.alternative”：

$('.altExpander').on('click', '.alternative', function(e)

如果您希望this成为锚标记，则需要使用

$('.altExpander').on('click', '.alternative a', function(e)

Jquery click - 认为它是父元素，而不是孩子

2 个答案: