js进阶 14-3 如何接收load函数从后台接收到的返回数据

一、总结

一句话总结:load方法的回调函数的参数即可接收从后台的返回数据。

1、load方法的回调函数的参数是什么?

语法:load(url,data,function(response,status,xhr))

回调函数参数含义

1. responseTxt-包含调用成功时的结果内容

2. statusTXT-包含调用的状态:可能是"success"、"notmodifide"、"error"、'timeout"、"abort"或"parsererror"中的一个,最长见的是:succes成功;error错误

3. Xhr-经过jQuery封装的XMLHttpRequest对象(保留其本身的所有属性和方法)

2、load的参数中的回调函数的参数中的xhr的属性中包括访问的信息,那么和第一个参数responseTxt的写法区别是什么?

xhr的属性是text,比如访问返回信息,xhr的属性是responseText,而第一个参数是txt

22             $('#test').load('test1.php',{
23 password:'123456'
24 },function(responseTxt,statusTxt,xhr){
25 //alert(responseTxt)
26 //$('#test').html(responseTxt+'谢谢访问')
27 //alert(statusTxt)
28 //if (statusTxt=='success') {alert('数据加载成功')}else(alert('出错了'))
29 //alert(xhr.responseText)
30 alert(xhr.statusText)
31 })

二、如何接收load函数从后台接收到的返回数据

1、相关知识

load()方法

jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法。

  • .load()从服务器加载数据,然后把返回到HTML放入匹配元素。

    语法:load(url,data,function(response,status,xhr))

    1.必需的URL参数规定您希望加载的URL。

    2.可选的data参数规定与请求一同发送的查询字符串键/值对集合。

    3.可选的callback参数是load()方法完成后所执行的函数名称

  • 回调函数参数含义

    1. responseTxt-包含调用成功时的结果内容

    2. statusTXT-包含调用的状态:可能是"success"、"notmodifide"、"error"、'timeout"、"abort"或"parsererror"中的一个,最长见的是:succes成功;error错误

    3. Xhr-经过jQuery封装的XMLHttpRequest对象(保留其本身的所有属性和方法)

 

2、代码

html

 <!DOCTYPE html>
<html lang="en">
<style>
</style>
<head>
<meta charset="UTF-8">
<title>演示文档</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<style type="text/css">
</style>
</style>
</head>
<input type="button" id="btn" value="Ajax测试">
<div id="test"></div>
<body>
<script type="text/javascript">
$(function(){
$('#btn').click(function(){
//get方式提交数据
// $('#test').load('test.php?password=1234560')
//post方式提交数据
$('#test').load('test1.php',{
password:'123456'
},function(responseTxt,statusTxt,xhr){
//alert(responseTxt)
//$('#test').html(responseTxt+'谢谢访问')
//alert(statusTxt)
//if (statusTxt=='success') {alert('数据加载成功')}else(alert('出错了'))
//alert(xhr.responseText)
alert(xhr.statusText)
})
})
})
</script>
</body>
</html>

php

 <?php
/*
//echo "51自学网";
//get方式提交数据
if ($_GET['password']=='123456') {
echo "登陆成功";
}else{
echo "密码错误";
}
*/
//post方式提交数据
if ($_POST['password']=='123456') {
echo "登陆成功";
}else{
echo "密码错误";
}
?>
 

js进阶 14-3 如何接收load函数从后台接收到的返回数据的更多相关文章

  1. js进阶 14 jquery的ajax有哪些函数和事件(多练)

    js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...

  2. js进阶 12-14 jquery的事件触发函数是哪两个

    js进阶 12-14 jquery的事件触发函数是哪两个 一.总结 一句话总结:trigger和triggerHandler 1.trigger传额外参数时候的注意事项是什么? 注意样例中是三个参数 ...

  3. js进阶 12-8 如何知道上一个函数的返回值是什么(如何判断上一个函数是否执行成功)

    js进阶 12-8 如何知道上一个函数的返回值是什么(如何判断上一个函数是否执行成功) 一.总结 一句话总结:event的result属性即可. 1.event的result属性的实际应用场景是什么? ...

  4. Python进阶:函数式编程(高阶函数,map,reduce,filter,sorted,返回函数,匿名函数,偏函数)...啊啊啊

    函数式编程 函数是Python内建支持的一种封装,我们通过把大段代码拆成函数,通过一层一层的函数调用,就可以把复杂任务分解成简单的任务,这种分解可以称之为面向过程的程序设计.函数就是面向过程的程序设计 ...

  5. (转)Python进阶:函数式编程(高阶函数,map,reduce,filter,sorted,返回函数,匿名函数,偏函数)

    原文:https://www.cnblogs.com/chenwolong/p/reduce.html 函数式编程 函数是Python内建支持的一种封装,我们通过把大段代码拆成函数,通过一层一层的函数 ...

  6. js Form表单转json格式,及后台接收(多种方法)

    转载:https://blog.csdn.net/qq_40138785/article/details/81533015 一.serialize()方法格式:var data = $("# ...

  7. 【spring 后台跳转前台】使用ajax访问的后台,后台正常执行,返回数据,但是不能进入前台的ajax回调函数中

    问题: 使用ajax访问的后台,后台正常执行,并且正常返回数据,但是不能进入前台的ajax回调函数中 问题展示:  问题解决: 最后发现是因为后台的方法并未加注解:@ResponseBody,导致方法 ...

  8. 【springMVC 后台跳转前台】1.使用ajax访问的后台,后台正常执行,返回数据,但是不能进入前台的ajax回调函数中 ----2.前后台都没有报错,不能进入ajax回调函数

    问题1: 使用ajax访问的后台,后台正常执行,并且正常返回数据,但是不能进入前台的ajax回调函数中 问题展示:  问题解决: 最后发现是因为后台的方法并未加注解:@ResponseBody,导致方 ...

  9. js进阶 14-2 如何用ajax验证登陆状态(这里用load方法)

    js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...

随机推荐

  1. Yeslab华为安全HCIE七门之--防火墙高级技术(17篇)

    Yeslab 全套华为安全HCIE七门之第三门 防火墙高级技术     课程目录: 华为安全HCIE-第三门-防火墙高级技术(17篇)\1_用户认证_用户_认证域_认证策略.avi 华为安全HCIE- ...

  2. Mark Sweep GC

    目录 标记清除算法 标记阶段 深度优先于广度优先 清除阶段 分配 First-fit.Best-fit.Worst-fit三种分配策略 合并 优点 实现简单 与保守式GC算法兼容 缺点 碎片化 分配速 ...

  3. 紫书 例题 9-2 UVa 437 ( DAG的动态规划)

    很明显可以根据放不放建边,然后最一遍最长路即是答案 DAG上的动态规划就是根据题目中的二元关系来建一个 DAG,然后跑一遍最长路和最短路就是答案,可以用记忆化搜索的方式来实现 细节:(1)注意初始化数 ...

  4. 【Henu ACM Round#17 A】Simple Game

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 肯定是放在m-1或者m+1的. (m-1是左边的点都离a最近,而m+1则是右边的点都离他最近. 看看哪个更好就行 [代码] #inc ...

  5. 单向链表 golang

    package main import "fmt" type Object interface {} //节点 type Node struct { data Object nex ...

  6. 【安卓】数据库基于脚本的&quot;增量更新&quot;,每次更新时不需改动java代码、!

    思路: 1.当然是基于SQLiteOpenHelper.onCreate(第一次安装程序时调用).onUpdate(升级程序时调用) 2.用"脚本"(脚本制作详细方法问度娘)做数据 ...

  7. jquery autocomplete文本自己主动补全

    文本自己主动补全功能确实非常有用. 先看下简单的效果:(样式不咋会写) 以下介绍几种: 1:jqery-actocomplete.js 这个网上有个写好的实例,上面挺具体的,能够下来执行下就清楚了就不 ...

  8. matlab中tic和toc使用方法

    tic和toc用来记录matlab命令运行的时间.  tic用来保存当前时间,而后使用toc来记录程序完毕时间. 两者往往结合使用,使用方法例如以下: 程序代码: tic  operations  t ...

  9. 流媒体技术 rtp/rtcp/rtsp资料精华!

     流媒体技术 rtp/rtcp/rtsp资料精华! 流媒体技术 流媒体是指在网络中使用流式(Sreaming)传输技术进行传输的连续时基媒体.如音频数据流或视频数据流,而不是一种新的媒体.流媒体技 ...

  10. Linux-----Ubuntu Server安装图形界面

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/ ...