Question

这是一个脚本，当点击链接时，它将从某个地方提取页面并将其插入当前页面的div中。非常简单，是的，但是我似乎很粗，我无法弄清楚如何实现它。

即。如何制定链接，以便将脚本指向页面我想加载我想要的div？

剧本：

$(document).ready(function() {  

    // Check for hash value in URL  
    var hash = window.location.hash.substr(1);  
    var href = $('#nav li a').each(function(){  
        var href = $(this).attr('href');  
        if(hash==href.substr(0,href.length-5)){  
            var toLoad = hash+'.html #content';  
            $('#content').load(toLoad)  
        }   
    });  

    $('#nav li a').click(function(){  

    var toLoad = $(this).attr('href')+' #content';  
    $('#content').hide('fast',loadContent);  
    $('#load').remove();  
    $('#wrapper').append('<span id="load">LOADING...</span>');  
    $('#load').fadeIn('normal');  
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);  
    function loadContent() {  
        $('#content').load(toLoad,'',showNewContent())  
    }  
    function showNewContent() {  
        $('#content').show('normal',hideLoader());  
    }  
    function hideLoader() {  
        $('#load').fadeOut('normal');  
    }  
    return false;

    });
});

说明书指定以下内容：

我们希望定位导航菜单中的链接，并在点击它们时运行一个功能：
```
$('#nav li a').click(function() {  
    // function here  
});
```
我们需要定义在点击链接时从哪个页面获取数据：
```
var toLoad = $(this).attr('href')+' #content';
```

loadContent函数调用请求的页面：

function loadContent() {  
    $('#content').load(toLoad,'',showNewContent)  
}

上述内容很可能是按预期运行脚本所需的全部内容但只有你知道怎么做，我才知道。

PS：所有这些来自的教程是here。

Answer 1

基本上拦截所有链接点击并改为发出AJAX请求...请记住在点击回调函数结束时return false。

$('a').click(function () {
  var href = $(this).attr('href');
  $.ajax({
    url: href,
    success: function (res) {
      $(res).appendTo('#target'); // add the requested HTML to #target
    }
  });
  return false; // important
});

我该如何实现这个Ajax脚本？

1 个答案: