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

を使用isすると、実際には、回答が示唆するよりも優れたパフォーマンスが得られると思いclosestます。

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

aこれは、要素自体が であるか、または に含まれているかどうかをチェックしaます。

これは、要素自体で一致closestを使用し、DOM ツリーをたどる必要がないため、より高速になるはずです。closest

Answer 3

これを試して

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

Answer 4

jquery では、tagName 属性 $("a").prop("tagName"); を取得するだけです。

Answer 5

更新: ターゲットが 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 6

の中に何かがあるかどうかをテストすることで、<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
    }
});