如何使用ajax加载外部页面

时间:2013-03-13 02:22:42

标签: jquery ajax

我有一个链接按钮,应该链接到另一个页面。该页面的内容应显示在当前页面上。我正在使用bootstrap框架,但是我创建的函数似乎不起作用。

这是我的代码;

<a href="" id="reslink">link1</a>

<div class="span8" id="maincont"></div>

的javascript;

$('#reslink').click(function(){
    $.ajax({
        type: "GET",
        url: "sample.html",
        data: { },
        success: function(data){
            $('#maincont').html(data);
        }
    });

});

3 个答案:

答案 0 :(得分:3)

也许load()对你来说是更好的选择?

$("#reslink").click(function() {
    $("#maincont").load("sample.html");
});

请注意,以这种方式加载内容可能会破坏历史记录和收藏夹。

答案 1 :(得分:3)

您有以下方法。

<强>第一

使用如下的html,。

<a href="Javascript:void(0);" id="reslink">link1</a>

Javascript:void(0);从脚本返回false。

<强>第二

请勿更改html代码中的任何内容,但请在jQuery代码中进行以下更改。

$('#reslink').click(function(e){
    e.preventDefault();
    $.ajax({
        type: "GET",
        url: "sample.html",
        data: { },
        success: function(data){
            $('#maincont').html(data);
        }
    });
});

e.preventDefault(); 阻止HTML的默认行为,以便您可以执行代码。

答案 2 :(得分:-1)

加载页面中的

body onload="abc()"在从ajax渲染时应该有效。