.NET中使用Jquery和Ajax（三） - load加载

标签：技术不行   前端看看   

首先创建两个webform页面，一个命名为Default.aspx，用来显示load结果。 一个为Ajax.aspx，用来被load。

比如我们在Ajax.aspx中随便输入一些文字或者其他，Work hard, Enjoy life~ 。

然后在Defaut.aspx中 引入Jquery 然后就可以开始我们的AJax load了。。

先在页面中插入一个botton 和两个DIV ,bottom用来触发load事件，DIV分别来载入load页面 和返回load结果。

<input type="button" value="AjaxLoad" id="btn" />
<h2>Html：</h2>
<div id="result"></div>
<h2>Result：</h2>
<div id="display"></div>

其次我们来看一下load()函数:

load是最简单的Ajax函数, 但是使用具有局限性:

1.它主要用于直接返回HTML的Ajax接口 

2.load是一个jQuery包装集方法,需要在jQuery包装集上调用,并且会将返回的HTML加载到对象中, 

即使设置了回调函数也不过不可否认load接口设计巧妙并且使用简单.下面通过示例来演示Load接口的使用:

load()函数:

函数介绍：load(url, [data], [callback]) 返回值:jQuery

参数说明：

url:待装入 HTML 网页网址。

data:（可选参数）发送至服务器的 key/value 数据。

callback:（可选参数）载入成功时回调函数。

接下来可以写我们的load JS了：

<script type="text/javascript">
    $(document).ready(function () {
        $("#btn").click(function () {
            $("#result").load("Ajax.aspx", function (responesText, responseStatus) {
                $("#display").append("<hr/> responseText : " + responesText);
                $("#display").append("<hr/> responseStatus : " + responseStatus);
            });
        });
    });
</script>

最后，运行代码可以得出结果：

 至此，我们使用Ajax的load()方法已成功实现。
 接下来我们可以使用AJAX中加入loading动画等等。

.NET中使用Jquery和Ajax（三） - load加载

标签：技术不行   前端看看   

原文地址：http://blog.csdn.net/tuzkiss1017/article/details/39205447