js进阶 14-4 $.get()方法和$.post()方法如何使用

一、总结

一句话总结:$.get(URL,callback); $.post(URL,data,callback); callback函数和load()方法里面的callback一样。

1、load方法和$.get()以及$.post()方法的区别是什么(load也可以实现ajax的post和get请求)?

load方法是局部变量,前面需要加上监听对象,监听对象就是返回结果放置的元素
$.get()以及$.post()时全局方法,不必加上监听对象

20             // $('#test').load('test.php?password=1234560')
40                   $.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){
41 // alert(responseTxt)
42 $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
43 })

2、$.get()提交数据四种方法?

a、url中?接参数

b、字符串(jquery1.3之后支持)

c、json对象

20                   //get方式提交数据1
21 /*
22 $.get('test.html',function(data,statusTxt){
23 alert(data)
24 alert(statusTxt)
25 })
26
27 //get方式提交数据2
28 $.get('testGet.php?password=123456',function(responseTxt,statusTxt){
29 // alert(responseTxt)
30 $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
31 })
32
33 //get方式提交数据3
34 $.get('testGet.php','password=123456',function(responseTxt,statusTxt){
35 // alert(responseTxt)
36 $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
37 })
38
39 //get方式提交数据4
40 $.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){
41 // alert(responseTxt)
42 $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
43 })
44
45 //post方式提交数据1
46 $.post('testPost.php',{password:'123456'},function(responseTxt,statusTxt){
47 // alert(responseTxt)
48 $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
49 })

二、$.get()方法和$.post()方法如何使用

1、相关知识

get()和post()方法

两种在客户端和服务器端进行请求-响应的常用方法是:GET和POST.
GET基本上用于从服务器获得(取回)数据。注释:GET方法可能返回缓存数据。
POST也可用于从服务器获取数据。不过,POST方法不会缓存数据,并且常用于连同请求一起发送数据。

  • $.get(URL,callback);

    参数

    1. 第一个参数是我们希望请求的URL;
    2. 第二个参数是回调函数。第一个回调参数存有被请求页面的内容,第二个回调参数存有请求的状态。
  • $.post(URL,data,callback);

    参数

    1. 必需的URL参数规定您希望请求的URL。
    2. 可选的data参数规定连同请求发送的数据
    3. 可选的callback参数是请求成功后所执行的函数名。第一个回调参数存有被请求页面的内容,而第二个参数存有请求的状态
    4. type:返回内容格式,xml,html,script,json,text,_default。
 

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>
<body>
<input type="button" id="btn" value="Ajax测试">
<div id="test"></div>
<script type="text/javascript">
$(function(){
$(function(){
$('#btn').click(function(){
//get方式提交数据1
/*
$.get('test.html',function(data,statusTxt){
alert(data)
alert(statusTxt)
}) //get方式提交数据2
$.get('testGet.php?password=123456',function(responseTxt,statusTxt){
// alert(responseTxt)
$('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
}) //get方式提交数据3
$.get('testGet.php','password=123456',function(responseTxt,statusTxt){
// alert(responseTxt)
$('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
}) //get方式提交数据4
$.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){
// alert(responseTxt)
$('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
}) //post方式提交数据1
$.post('testPost.php',{password:'123456'},function(responseTxt,statusTxt){
// alert(responseTxt)
$('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
})
*/
//post方式提交数据2
$.post('testPost.php','password=123456',function(responseTxt,statusTxt){
// alert(responseTxt)
$('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)
})
})
})
})
</script>
</body>
</html>

php(post请求和get请求)

get

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

post

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

js进阶 14-4 $.get()方法和$.post()方法如何使用的更多相关文章

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

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

  2. js进阶 11-18 jquery中操作选择器的方法有哪些

    js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...

  3. Node.js进阶:5分钟入门非对称加密方法

    前言 刚回答了SegmentFault上一个兄弟提的问题<非对称解密出错>.这个属于Node.js在安全上的应用,遇到同样问题的人应该不少,基于回答的问题,这里简单总结下. 非对称加密的理 ...

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

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

  5. js进阶 14-6 $.ajax()方法如何使用

    js进阶 14-6 $.ajax()方法如何使用 一.总结 一句话总结:$.ajax([settings])settings可选.用于配置Ajax请求的键值对集合. 1.$.ajax()的特点是什么( ...

  6. js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么

    js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么 一.总结 一句话总结:$.getScript()和$.getJSON()方法专门用来加载JS/JSON文件(远程 ...

  7. js进阶 14-1 jquery的ajax系列中的load方法的作用是什么

    js进阶 14-1 jquery的ajax系列中的load方法的作用是什么 一.总结 一句话总结:jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法. 1.load函 ...

  8. js进阶 12-13 jquery中one方法和trigger方法如何使用

    js进阶 12-13 jquery中one方法和trigger方法如何使用 一.总结 一句话总结: 1.one()方法和on()方法的区别是什么? 除了one()只执行一次,其它和on()一模一样,包 ...

  9. js进阶课程 12-9 jquery的事件对象event的方法有哪些?

    js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...

随机推荐

  1. df---显示磁盘分区使用空间

    df命令用于显示磁盘分区上的可使用的磁盘空间.默认显示单位为KB.可以利用该命令来获取硬盘被占用了多少空间,目前还剩下多少空间等信息. 语法 df(选项)(参数) 选项 -a或--all:包含全部的文 ...

  2. HttpClient方式调用接口的java 简单案例源码+附jar包

    1 package com.itNoob.httpClient; import org.apache.commons.httpclient.HttpClient; import org.apache. ...

  3. Spring MVC原理及实例基础扫盲篇

    近期 项目中刚接触了SpringMVC,就把这几天看的跟实践的东西写出来吧. 一.首先,先来了解一下SpringMVC究竟是个什么样的框架? Spring Web MVC是一种基于Java的实现了We ...

  4. HTTP基础知识整理

    http请求由三部分组成,分别是:请求行.消息报头.请求正文 HTTP(超文本传输协议)是一个基于请求与响应模式的.无状态的.应用层的协议,常基于TCP的连接方式,HTTP1.1版本中给出一种持续连接 ...

  5. HTML5入门:HTML5的文档声明和基本代码

    HTML5的文档声明: HTML5的文档声明,不同于HTML4.0和XHTML,它精简了许多代码,只保留<!DOCTYPE html>开头,必须位于HTML5文档的第一行,它可以用来告诉浏 ...

  6. JDK版本切换批处理脚本

    我们经常在开发是遇到jdk版本切换的问题 1.手动去修改JAVA_HOME环境变量,将变量的值指向对应的JDK版本的安装目录即可. 2.通过编写批处理脚本来根据选择的JDK版本动态修改JAVA_HOM ...

  7. OpenStack安装及监控配置视频教程

    OpenStack是一个美国国家航空航天局和Rackspace合作研发的云端运算软件,是一个自由软件和开放源代码项目,用来建立公共和私有云本,其软件使用比较复杂,本视频将讲解其安装和部分配置方法,以后 ...

  8. 分享js寄生组合模式继承

    function person(){ this.name = 'taobao'; this.showMess = function(){ return this.name; } } person.pr ...

  9. mysql字符设置乱码问题

    在操作系统中对于任意一个字符而言是没有编码格式概念的:同样的字母在不同的编码集里面可能代表不同的东西:关键在于你用什么样的软件打开它,软件本身是以什么样的编码格式来显示你的字符,那么你的字符当前就是什 ...

  10. 【bzoj4864】神秘物质

    Description 给出一个长度为n的序列,第i个数为ai,进行以下四种操作: merge x e:将当前第x个数和第x+1个数合并,得到一个新的数e: insert x e:在当前第x个数和第x ...