Question

嗨，我一直试图让这件事工作一段时间。

基本上我们刚刚重建了我们网站的移动/桌面版本。现在我们正在尝试创建一个快速的jQuery脚本，以使用.load（）jQuery功能创建包含我们的URL的页面和链接。我们不想回到97页和10个脚本。这就是我们目前正在使用的......

<a href=<?php echo PROTOCOL."secure3.idsma.".URL."/secure/user/authentication/sso/login/initiate?returnURL=$return"; ?>">

这就是我们试图让脚本去做的事情。

<a onclick="$('html').load('<?php echo PROTOCOL."secure3.idsma.".URL."/secure/user/authentication/sso/login/initiate?returnURL=$return"; ?>')">

但是我试图通过制作一个可以检测链接的脚本来自我们的网站并添加一个触发jQuery函数来加载页面的类来提高效率。

此外，当点击链接时，我如何才能使.scrollToTop（）jQuery函数起作用？

感谢您的帮助。对不起，我的英语句子结构不是很好。

如果可以，请帮忙。再次感谢您的帮助。

Answer 1

您可以收听链接上的点击次数，并检查该链接是否来自您的网站。如果是，则动态加载数据并return false以防止链接重新加载页面。

$(document).on('click','a', function(e){
    var isFromMySite = e.currentTarget.href.indexOf('secure3.idsma.') > -1;

    if(isFromMySite){
        $('html').load(this.href);
        return false;
    }
});

JS Fiddle demo

Answer 2

我认为你必须做这样的事情

$(document).ready(function(){
   // find all the links within the document
   $('a').click(function(ev){
      // handle the click on internal link here, recognized by existence of secure3.idsma string
      if($(this).attr('href').indexOf('secure3.idsma') !== -1)
      {
          ev.preventDefault();

          // load the link via ajax
          $.ajax({
              url: $(this).attr('href'),
              success: function(response){
                   // populate the html, and use animate to scroll to the top
                   $("html").html(response).add('body').animate({ scrollTop: 0 });
              }
          });
      }
   });
});

但是，我建议不要这样使用AJAX - 通常，您不想重新加载整个文档;你想重新加载实际正在改变的文档部分，所以，可能是一些div#main-container等。另外请记住，你必须在你插入的内容上应用这个功能（所以可能这个脚本应该在一些引导程序中）

jQuery链接导航功能

2 个答案:

JS Fiddle demo