Question

我有一个页面，其中包含一个名为“myLinkClass”的链接。这些链接可以驻留在两个DOM结构之一中：

<div class="divClassA">
    <a class="myLinkClass" ...
</div>

或

<div class="divClassB">
    <a class="myLinkClass" ...
</div>

我将带有类的链接的click事件与使用jQuery的事件处理程序挂钩：

$(document).ready(function () {
    $('.myLinkClass').bind('click', function (event) {
        //...
    });
});

如何查看点击的链接是否位于divClassA或divClassB内？

请注意，尽管上面示例中的链接是div的子节点，但情况可能并非如此。此外，divClassA和divClassB可能都有任意数量（不只是其中一个）。

Answer 1

您可以查看点击的元素是否包含ancestor divClassA。如果没有，您应该能够假设它在divClassB：

$('.myLinkClass').bind('click', function (event) {
    if($(this).closest(".divClassA").length) {
        //Inside divClassA
    }
    else {
        //Not inside divClassA!
    }
});

以上是working example以上内容。

Answer 2

可能是

$(document).ready(function () {
    $('.myLinkClass').bind('click', function (event) {
        if($(this).parents('.divClassB').length) {
           //parent has divClassB
        }
    });
});

但是，如果您尝试为不同的“divClasses”创建不同的事件，那么这样的事情可能会更充分：

$(document).ready(function () {
    $('.divClassA .myLinkClass').bind('click', function (event) {
        //in divClassA
    });
    $('.divClassB .myLinkClass').bind('click', function (event) {
        //in divClassB
    });
});

Answer 3

你可以这样试试：

var parent = $(this).parent;
var parentName = parent.attr('class');

Answer 4

$('.myLinkClass').bind('click', function (event) {
    if $(this).parent('div.divClassB') {
       ... it's in a classB ...
    }
});

Answer 5

HTML：

<div class="divClassB">
    <a class="myLinkClass">click1</a>
</div>
<div class="divClassA">
    <a class="myLinkClass">click2</a>
</div>

<强> jQuery的：

$('.myLinkClass').bind('click', function (event) {
    alert($(this).parent().attr('class')); 
});

在此代码中，alert将显示父div的类名。如果您想在条件中使用此名称，请尝试使用以下内容（如果您有超过2个<a>标记）：

$('.myLinkClass').bind('click', function (event) {
    switch($(this).parent().attr('class'))
    {
         case 'divClassB':
                    //do your stuff
                    break;
         case 'divClassA':
                    //do your stuff
                    break;
    } 
});

在点击链接的DOM中查找“位置”

5 个答案: