ajax用post方法,jquery中get,post和ajax方法的使用小结
在JQuery中可以使用get,post和ajax方法给服务器端传递数据
get方法的使用(customForGet.js文件):
function verify(){
//1.获取文本框的数据
//通过DOM的方式获取
//document.getElementByIdx("userName");
//通过JQuery的方式获取
var jqueryObj = $("#userName");
//获取节点的值
var userName = jqueryObj.val();
//2.将文本框的数据发送到服务器端的servlet
$.get("AJAXServer?name=" + userName,null,callback);
}
//回调函数
function callback(data){
//3.接受从服务器端返回的数据
// alert(data);
//4.将服务器端的返回的数据显示到页面上
//取到用来显示结果信息的节点
var resultObj = $("#result");
resultObj.html(data);
}
可以将上面的文件简写成:
function verify(){
$.get("AJAXServer?name="+$("#userName").val(),null,function callback(data){$("#result").html(data);});
}
post方法的使用(customForPost.js):
function verify(){
//1.获取文本框的数据
//通过DOM的方式获取
//document.getElementByIdx("userName");
//通过JQuery的方式获取
var jqueryObj = $("#userName");
//获取节点的值
var userName = jqueryObj.val();
//2.将文本框的数据发送到服务器端的servlet
// $.post("AJAXServer?name=" + userName,null,callback);//用post是也可以直接将参数跟在URL后面
$.post("AJAXServer",{name:userName,test:"test123"},callback);//传递多个参数时用逗号隔开,属性值如果是变量的话直接写上,如:userName,如果是字符的话要加上引号,如:“test123”.
}
//回调函数
function callback(data){
//3.接受从服务器端返回的数据
// alert(data);
//4.将服务器端的返回的数据显示到页面上
//取到用来显示结果信息的节点
var resultObj = $("#result");
resultObj.html(data);
}
可以将上面的文件简写成:
function verify(){
$.post("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data)});
}
总结:其实get和post方法相似,只要将get和post互换即可,而参数的存放位置两个地方都行;
如:
$.post("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data)});
只要将post直接改成get,而不用修改参数的位置,即:
$.get("AJAXServer",{name:$("#userName").val(),test:"test123"},function(data){$("#result").html(data)});
ajax方法的使用(customForAjaxText)接收数据类型是纯文本的数据:
function verify(){
//1.获取文本框的数据
//通过JQuery的方式获取
var jqueryObj = $("#userName");
//获取节点的值
var userName = jqueryObj.val();
//2.将文本框的数据发送到服务器端的servlet
$.ajax({
type:"POST",
url:"AJAXServer",
data:"name="+userName+"&"+"test=123",
success:function(data){
$("#result").html(data);
}
});
}
ajax方法的使用(customForAjaxText)接收数据类型是XML的数据:
function verify(){
//1.获取文本框的数据
//通过JQuery的方式获取
var jqueryObj = $("#userName");
//获取节点的值
var userName = jqueryObj.val();
//2.将文本框的数据发送到服务器端的servlet
$.ajax({
type:"POST",
url:"AJAXXMLServer",
data:"name="+userName+"&"+"test=123",
dataType:"xml",
success:function(data){
//首先需要将传过来的DOM对象转化为jquery对象
var jqueryObj = $(data);
//获取message节点
var messageNods = jqueryObj.children();
//获取文本内容
var responseText = messageNods.text();
$("#result").html(responseText);
}
});
}
ajax用post方法,jquery中get,post和ajax方法的使用小结相关推荐
- ajax离开页面方法,jQuery中ajax调用当前页面方法
$.ajax({ type: 'POST', url: 'AddressManager.aspx/GetProvince',//AddressManager.aspx当前页面 data: '{cach ...
- ajax在jQuery的应用,Ajax在jQuery中的应用($.ajax()方法)
Ajax() 方法 $.ajax() 中的参数及使用方法 在jQuery中,$.ajax() 是最底层的方法,也是功能最强的方法.$.get().$.post().$.getScript().getJ ...
- jQuery中的$.getJSON、$.ajax、$.get、$.post的区别
jQuery中的$.getJSON.$.ajax.$.get.$.post的区别 使用见Flask(python)异步(ajax)返回json格式数据 ①.$.getJSON $.getJSON()是 ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法 <strong>//1.获取和设置样式</strong> $("#tow").attr("class&q ...
- 流程代码中js报错,在javaScript或者jQuery中字符串比较没有equals()方法
问题: 流程走不下去. 原因: 在javaScript或者jQuery中字符串比较没有equals()方法,要比较两个字符串是否相等可以直接用==或者is()进行判断. //判断是否为未签约有风险等级 ...
- jquery中prop()方法和attr()方法
接着上一篇笔记的疑惑,找了下prop()方法和attr()方法的区别.原来query1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值. 大 ...
- js进阶 10-3 jquery中为什么用document.ready方法
js进阶 10-3 jquery中为什么用document.ready方法 一.总结 一句话总结: 1.document.ready和window.onload的区别:用哪个好? document. ...
- html图片的隐藏与显示,Jquery中使用show()与hide()方法动画显示和隐藏图片
(1)功能描述 在页面中单击"显示"连接,通过show()方法以动画的方式显示一幅图片,同时在方法中执行一个回调函数,用于改变图片的边框样式:单击已显示的图片时,通过hide()以 ...
- jQuery中的append()和appendTo()方法
jQuery中的append()和appendTo()方法的效果不是简单的"插入"元素到指定位置,实际上是"移动"元素到指定位置. 参考jQuery API中的 ...
最新文章
- 第十九章——使用资源调控器管理资源(2)——使用T-SQL配置资源调控器
- 怎么从华为nova4导入计算机,手机知识:华为nova4怎么导出联系人
- Linux基础命令---文本格式转换expand、unexpand
- 五年之后的私有云和公有云会是什么样子
- jq封装post请求数据_GitHub - xiaohange/JQHttpRequest: GET/POST / PUT / DELETE 网络请求的封装...
- Cpp 11 / 线程库 / 可以做为线程的执行对象有哪些?
- Mybatis中重要的小知识点
- Eclipse在更换工作空间之后很多设置要重新配置
- 面向过程和面向对象的本质理解
- insertRole attempted to return null from a method with a primitive return type
- python文件之间的相互调用_「Python 系列」 Python 生成器函数详解
- JAVA人脸识别(人脸对比)
- C语言指针详解(超级详细)
- JDK动态代理原理解析
- arm64位的Centos7镜像安装JDK
- ios 设置导航栏背景色
- 10和100Mbps以太网
- FPGA功耗那些事儿(转载)
- Mac更新系统后无法使用git
- iPhone最强悍对抗者——HTC崛起的秘密
热门文章
- mysql卸载权限不够_Linu下启动MySQL结果显示:env: /etc/init.d/mysql:权限不够怎么解决?...
- GIS实用小技巧(一)-如何将RTK测量数据导入CAD中?
- action怎么获得 ajax date参数_ajax()gt;load()事件的新用法!!!
- ssm异常捕获和处理
- 计算机应用昨早领域,计算机应用-第1章.ppt
- 【ECharts系列|02可视化大屏】 舆情分析,人口分析及警情警力活动情况的实现【下篇】
- java 文件上传 servlet_java文件上传-原始的Servlet方式
- mysql注入提取邮件_【sql注入教程】mysql注入直接getshell
- vue 项目的I18n国际化之路
- ESLint共享配置的两种方式eslint-plugin和eslint-config