源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jquery中get,post和ajax方法的使用小结

  • 时间:2020-01-31 14:46 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jquery中get,post和ajax方法的使用小结
在JQuery中可以使用get,post和ajax方法给服务器端传递数据 [b]get方法的使用(customForGet.js文件):[/b] 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);}); } [b]post方法的使用(customForPost.js):[/b] 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)}); } [b]总结:[/b]其实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)}); [b]ajax方法的使用(customForAjaxText)接收数据类型是纯文本的数据:[/b] 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); } }); } [b]ajax方法的使用(customForAjaxText)接收数据类型是XML的数据:[/b] 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); } }); }
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部