サイト上の任意のリンク（a）をクリックしたときにjQuery関数を実行するには

Question

私は、HTMLとPHP以外にはほとんどアクセスできないコアコマースシステム上に新しいサイトビルドを作成しました。私が使用できるのはJavaScriptだけです。彼らのシステムは現在、ページの読み込み速度が良くないので、ページが読み込まれるまでに5〜8秒待っているうちに、何かを知ることを顧客に求めたかったのです。そこで、いくつかのコードを見つけて、ページがロードされている間にGIFをロードするオーバーレイを表示するようにまとめました。現在のところ、ページ上の任意の場所をクリックすると実行されますが、サイトのリンク（href）がクリックされたとき（リンクあり）にのみ実行されます。

は、私はあなたがページの読み込み中に実行するコードを行うことができます知っているが、これは、それは遅すぎるとにかく

（数秒後）に実行されるよう十分ではありません、これは私のウェブサイトであるwww.cosmeticsbynature.comこれは私が使用するコードです。どんな助けも素晴らしいでしょう。

<div id="loading"><img src="doen'tallowmetopostanimage" border=0></div> 


<script type="text/javascript"> 
var ld=(document.all); 
var ns4=document.layers; 
var ns6=document.getElementById&&!document.all; 
var ie4=document.all; 
    if (ns4) 
ld=document.loading; 
else if (ns6) 
ld=document.getElementById("loading").style; 
else if (ie4) 
ld=document.all.loading.style; 
jQuery(document).click(function() 
{ 
if(ns4){ld.visibility="show";} 
else if (ns6||ie4) 
var pb = document.getElementById("loading"); 
pb.innerHTML = '<img src="http://www.cosmeticsbynature.com/00222-1/design/image/loading.gif" border=0>'; 
ld.display="block"; 
}); 
</script> 

Answer 1

あなたは、コードをクリックするユーザーが実行されますので、これまでの文書へのクリックハンドラをバインドされてやっている、コードのこの部分を変更

jQuery(document).click(function() 

jQuery("a").click(function() 

へ

Answer 2

$("a").click(function(){ 
//show the busy image 
}); 

Answer 3

//to select all links on a page in jQuery 
jQuery('a') 

//and then to bind an event to all links present when this code runs (`.on()` is the same as `.bind()` here) 
jQuery('a').on('click', function() { 
    //my click code here 
}); 

//and to bind to all links even if you add them after the DOM initially loads (`on()` is the same as `.delegate()` here; with slightly different syntax, the event and selector are switched) 
jQuery(document).on('click', 'a', function() { 
    //my click code here 
}); 

注：.on()はjQuery 1.7の新機能です。

Answer 4

jQueryをページに組み込むと、これを簡単に実行できます。それが完了すると、あなたが行うことができます：

$('a').click(function() { 
// .. your code here .. 
return true; // return true so that the browser will navigate to the clicked a's href 
} 

これはどう

Answer 5

- 私は{表示：なし} #loading仮定

<div id="loading"><img src="http://www.cosmeticsbynature.com/00222-1/design/image/loading.gif" border=0></div> 
<script type="text/javascript"> 
document.getElementById('loading').style.display='block'; // show the loading immediately 
window.onload=function() 
    document.getElementById('loading').style.display='none'; // hide the loading when done 
} 
</script> 

Answer 6

http://jsfiddle.net/vol7ron/wp7yU/

私はのほとんどで見る問題を答えは、人々はクリックイベントが<a>（アンカー）タグから来ると仮定しているという回答です。私の練習では、よくクリックイベントをspanとliタグに追加します。答えはそれらを考慮に入れません。

jQuery.click(function(){})または<htmlelement onclick="" />で作成された両方のイベントを含む要素については、以下の解決策を参照してください。

上記を使用して

$(document).ready(function(){ 

    // create jQuery event (for test) 
    $('#jqueryevent').click(function(){alert('jqueryevent');}); 

    // loop through all body elements 
    $('body *').each(function(){ 

     // check for HTML created onclick 
     if(this.onclick && this.onclick.toString() != ''){ 
      console.log($(this).text(), this.onclick.toString()); 
     } 

     // jQuery set click events 
     if($(this).data('events')){   
      for (key in($(this).data('events'))) 
       if (key == 'click') 
        console.log($(this).text() 
           , $(this).data('events')[key][0].handler.toString()); 
     } 
    }); 
}); 

、あなたは配列を作成し、配列に見つかった要素をプッシュしたい場合があります（あなたがconsole.log