javascript - jQuery检查目标是否为链接

Question

我有一个捕获点击的全局函数。

$(document).click(function(e){
  //do something
  if(clickedOnLink)
    //do something
});

当目标是链接时，我想做一些额外的事情，但是如果<a>标签实际上围绕着一个 div（因为 HTML5 允许这样做），那么目标就是那个 div。

http://jsfiddle.net/Af37v/

Answer 1

您可以尝试查看您单击的元素是标签的子元素还是<a>标签的子元素。

$(document).click(function(e){
    if($(e.target).closest('a').length){
        alert('You clicked a link');
    }
    else{
        alert('You did not click a link');
    }
});

Answer 2

我相信 usingis实际上会比建议的答案具有更好的性能closest：

$(e.target).is('a, a *');

这将检查元素本身是否为 ana或是否包含在a.

这应该更快，closest因为它将在元素本身上使用匹配项，并且不需要像closest将要那样遍历 DOM 树。

Answer 3

试试这个

$(document).click(function(e){
  //do something
  if($(this).closest('a').length)
    //do something
});

Answer 4

如果确切的目标是链接，那么您可以使用.is()

例子：

$(".element").on("click", function(e){
  if($(e.target).is("a")){
    //do your stuff
  }
});

编辑：

如果它被锚标签内的其他元素包围，那么您可以使用closest()并检查它是否有锚标签父或没有使用length

例子：

$(".element").on("click", function(e){
  if($(e.target).closest("a").length){
    //do your stuff
  }
});

Answer 5

使用 jquery 只需获取 tagName 属性 $("a").prop("tagName");

Answer 6

更新：您可以检查目标是否为 a 或父级是否为 a。

$(function () {
    $(document).on('click', function (e) {
        $target = $(e.target);
        if ($target.closest('a').length > 0) {
            alert('i am an a');
        }
    });
});

http://jsfiddle.net/8jeGV/4/

Answer 7

您可以<div>通过<a>测试里面是否有任何东西来测试是否有底。如果里面什么都没有，或者没有，语句将返回。.children() <div><div>iffalse

我建议这段代码：

$(document).click(function(e){
    var willRedirect = ($('a[href="/"]').attr('href').indexOf('#') == -1 ? true : false),

    //run code

    if ( willRedirect === false ){
        e.preventDefault();

        //the link will not redirect

        if ( $(this).children('div').html() ){
            //there is a <div> inside <a> containing something
        }
        else {
            //there is no <div> inside <a>
        }
    }
    else {
        //the link is not pointing to your site
    }
});