jqueryを通してすべてのリンクに関数を追加するには？

Question

次の関数を使用してページを読み込みます。私はリンクの負荷があり、すべてのリンクに追加することはできません。私はすべてのリンクに追加したいがないように、「INDEX

var oP = document.getElementsByTagName("a"), 
    ctr = 0 
; 

while(ctr < oP.length) { 
    var oldHref = document.getElementsByTagName("a")[ctr].href; 

    document.getElementsByTagName("a")[ctr].href = "javascript:loadPage('" + oldHref + "');"; 
    ctr++; 
} 

：

function LoadPage(url) { 
    $("#canvas").load(url); 
} 

は、私はすべての<a>タグにhref値を取得し、ちょうど次のようにすべてのリンクには、この機能を追加する機能が欲しいです。 HTML "このような

Answer 1

何か：

// select all links 
$('a') 
    // check that the pathname component of href doesn't end with "/index.html" 
    .filter(function() { 
    return !this.href.pathname.match(/\/index\.html$/); 
    // // or you may want to filter out "/index.html" AND "/", e.g.: 
    // return !this.href.pathname.match(/\/(index\.html)?$/i) 
    }) 
    // add a click event handler that calls LoadPage and prevents following the link 
    .click(function(e) { 
    e.preventDefault(); 
    LoadPage(this.href); 
    }); 

あなたが動的にページのセクションをロードしているので、あなたが代わりにイベントの委任を設定する必要があります。これを行う方法は、使用しているjQueryのバージョンによって異なりますが、.on()（jQuery 1.7+）または.delegate()（jQuery 1.7より前）のいずれかの関数を使用します。あなたは新しいし、@ AnthonyGristのような関数を適用するために使用できるコールバック関数のために新たにロードされたページ、$.load() takes a second argument上のリンクの変換についてあなたの質問への回答で

$('body').on('click', 'a', function(e) { 
    if(!this.href.pathname.match(/\/index\.html$/)) { 
     e.preventDefault(); 
     LoadPage(this.href); 
    } 
}); 

Answer 2

：.on()の例では、このようになりますコンテンツ、例えば：

function loadPage(url) { 
    // add a callback to $.load() to be executed for the next content 
    $("#canvas").load(url, function() { convertLinks(this); }); 
} 

function convertLinks(context) { 
    // select all links in the given context 
    $('a', context) 
    // check that the pathname component of href doesn't end with "/index.html" 
    .filter(function() { 
     return !this.href.pathname.match(/\/index\.html$/); 
     // // or you may want to filter out "/index.html" AND "/", e.g.: 
     // return !this.href.pathname.match(/\/(index\.html)?$/i) 
    }) 
    // add a click event handler that calls LoadPage and prevents following the link 
    .click(function(e) { 
     e.preventDefault(); 
     loadPage(this.href); 
    }) 
    ; 
} 

// call convertLinks on the whole document on initial page load 
$(function() { convertLinks(document); }); 

.on()を使用しても同様に合理的な解決策です。