1

我不太了解 ajax 是如何工作的,但我看过一些教程,允许我div通过单击按钮将 a 更改为网页。

有没有办法通过读取标签内的属性将点击的链接加载到div标签中而不刷新<a>

我有以下 HTML:

<table align='center'>
    <tr>
        <td>
            <a href='http://libraryofalexandria.tk/index.php'>Home</a>
        </td>
        <td>
            <a href='http://libraryofalexandria.tk/pdfupload.php'>Book Upload</a>
        </td>
        <td>
            <a href='http://libraryofalexandria.tk/booksearch.php'>Book search</a>
        </td>
    </tr>
</table>
<div id='pageLoad'></div>

​​​​​​​​​​​​​​​</p>

4

3 回答 3

4

是的,您可以使用 jQuery 的.load()方法来做到这一点。

它会是这样的:

// Catch the click on your a tag
$("a").click(function(){
    // Load the content of the page referenced in the a-tags href
    $("#pageLoad").load($(this).attr("href"));
    // Prevent browsers default behavior to follow the link when clicked
    return false;
});

值得注意的是,从其他域访问数据受到同源策略的限制。来自 jQuery 文档.load()

由于浏览器安全限制,大部分“Ajax”请求都受同源策略的约束;请求无法从不同的域、子域或协议成功检索数据。

如果是这种情况,您可能需要查看CORSJSONP

于 2012-09-16T09:45:16.300 回答
3

您可以将点击事件附加到链接并使用load()将内容加载到 div 中。

$("a").click(function() {        
    $("#pageLoad").load(this.href);

    return false;
});​

由于跨域安全限制,这仅在链接位于同一域中时才有效。有关更多详细信息,请参阅同源策略文档。

于 2012-09-16T09:50:05.270 回答
1

有很多方法可以煮鸡蛋,但听起来你会发现 jQuery 的 Load 在这种情况下很有用:

http://api.jquery.com/load/

于 2012-09-16T09:48:00.113 回答