zoukankan      html  css  js  c++  java
  • jQuery与Ajax

          jQuery使Ajax变得简单,它提供了很多Ajax方法,通过这些方法,能够从远程服务器上异步请求获取诸如文本、HTML、XML或JSON等数据,并把这些外部数据直接载入网页的被选元素中。

    1.$(selector).load(URL, data, callback)方法

          该方法从服务器加载数据,并把返回的数据放入被选元素中。其中:

    • URL,必需的参数,指定希望加载数据的URL;
    • data,可选的参数,要发送给服务器的数据,以Key/value的键值对形式表示,会做为QueryString附加到请求URL中;
    • callback,可选的参数,指定load()方法完成后所执行的函数名称。

          load()方法默认使用GET方式来传递,如果[data]参数传递数据进去,就会自动转换为POST方式。例如:

    $(document).ready(function(){
        $('#btn1').click(function(){
            $('#test').load('Home/ShowFileFN');
        })
    });

          load()方法从服务器端获取文件数据,控制器方法ShowFileFN()将返回一个文件数据,load()放法获取该数据后显示在id文件为test的HTML元素内。

     >>练习1:请实现本例子的效果。(如果遇到困难,看看视频吧)

     2.$.get(URL, data, callback)方法

           该方法用于通过GET请求从服务器上请求数据。get()方法只在请求成功时可调用回调函数,如果需要在出错时执行函数,需使用$.ajax。

     $('#btn2').click(function () {
                    $.get('Home/ShowFileFN1', function (data, status) {
                        alert("数据:" + data + "
    状态:" + status);
                    })
                });

     >>练习2:请实现本例子的效果。(如果遇到困难,看看视频吧)

    3.$.post(URL, data, callback, type)方法

           该方法通过POST请求将数据提交到从服务器处理。type为可选的参数,指定客户端请求的数据类型(JSON、XML等)。

           post()方法只在请求成功时可调用回调函数,如果需要在出错时执行函数,需使用$.ajax。

     $('#btn3').click(function () {
                    $.post('Home/ShowFileFN2', function (data, status) {
                        alert("数据:" + data + "
    状态:" + status);
                    })
                });

    4.$.ajax(options)方法

          该方法通过HTTP请求加载远程数据。ajax()方法返回其创建的XMLHttpRequest对象,大多数情况下无需直接操作该对象,但特殊情况下可用于手动终止请求。

          ajax()方法是jQuery的底层Ajax实现,而get()和post()等方法则是简单易用的高层实现。

          ajax()方法只包含一个参数,该参数是可选的。options用于配置Ajax请求,该参数可以通过$.ajaxSetup()设置任何选项的默认值。

     $('#btn4').click(function () {
                    htmlobj=$.ajax({url:"Home/ShowFileFN3", async:false});
    $("#test3").html(htmlobj.responseText);
    });
  • 相关阅读:
    网安-04-DHCP部署与安全、DNS部署与安全
    网安-03-NTFS安全权限、文件共享服务器
    网安-02-批处理、病毒、用户与组管理、破解系统密码
    网安-01-IP详解及简单的DOS命令
    [异常笔记]required a bean of type 'org.quartz.JobExecutionContext' that could not be found
    [异常笔记]poi读取Excel异常
    CentOS7 minimal 没有netstat命令
    Docker运行Nginx服务器
    大数据开发从入门小白到删库跑路(一)- 获取Hadoop
    Docker 运行MangoDB
  • 原文地址:https://www.cnblogs.com/meetyy/p/4118629.html
Copyright © 2011-2022 走看看