0

我正在使用以下功能来加载页面。我有很多链接，无法添加到所有链接。

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

我想要一个函数，它将获取所有<a>标签href值并将此函数添加到所有链接，如下所示：

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++;
}

我想添加到所有链接，但不添加到“INDEX.HTML”。

4

2 回答 2

2

像这样的东西：

// 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 之前的) 函数。该.on()示例如下所示：

$('body').on('click', 'a', function(e) {
    if(!this.href.pathname.match( /\/index\.html$/ )) {
        e.preventDefault();
        LoadPage(this.href);
    }
});
于 2012-04-07T19:52:45.627 回答
0

在回答您关于在新加载页面上转换链接的问题时，为回调函数$.load()获取第二个参数，您可以使用该回调函数将@AnthonyGrist 之类的函数应用于新内容，例如：

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()也是一个合理的解决方案。

于 2012-04-07T20:18:47.827 回答