jQuery中get方法用法分析


Posted in Javascript onDecember 07, 2016

本文实例讲述了jQuery中get方法用法。分享给大家供大家参考,具体如下:

参数:url,[data],[callback],[type]

url 待载入页面的URL地址。
data 待发送 Key/value 参数。
callback 载入成功时回调函数。
type 返回内容格式,xml, html, script, json, text, _default。

案例1

表单代码:

<form id="form1" action="#">
<p>评论:</p>
 <p>姓名: <input type="text" name="username" id="username" /></p>
 <p>内容: <textarea name="content" id="content" rows="2" cols="20"></textarea></p>
 <p><input type="button" id="send" value="提交"/></p>
</form>

待处理div代码:

<div class='comment'>已有评论:</div>
<div id="resText" >
</div>

jQuery代码:

<script type="text/javascript">
//<![CDATA[
 $(function(){
  $("#send").click(function(){
   $.get("get1.php", { 
      username : $("#username").val() , //传入参数
      content : $("#content").val() 
     }, function (data, textStatus){
      $("#resText").html(data); // 把返回的数据添加到页面上
     }
   );
  })
 })
//]]>
</script>

PHP代码:

<?php 
  header("Content-Type:text/html; charset=utf-8");
  echo "<div class='comment'><h6>{$_REQUEST['username']}:</h6><p class='para'>{$_REQUEST['content']}</p></div>";
?>

当用户点击send按钮时,触发click事件,对数据进行处理。主要传入两个参数,一个是用户名,一个是内容。这两个参数被传递到php页面。PHP页面处理完毕后,返回输入数据,get方法处理返回的数据。分析代码,可以看出,这数据,被写入了resText这个div层中。整个过程页面并没有刷新。很安静的处理了数据的传输。

案例2,以xml的格式处理数据

表单代码同上。

待处理div代码同上。

jQuery代码:

<script type="text/javascript">
//<![CDATA[
 $(function(){
  $("#send").click(function(){
   $.get("get2.php", { 
      username : $("#username").val() , 
      content : $("#content").val() 
     }, function (data, textStatus){
      var username = $(data).find("comment").attr("username");
      var content = $(data).find("comment content").text();
      var txtHtml = "<div class='comment'><h6>"+username+":</h6><p class='para'>"+content+"</p></div>";
      $("#resText").html(txtHtml); // 把返回的数据添加到页面上
     });
  })
 })
//]]>
</script>

PHP代码:

<?php 
  header("Content-Type:text/xml; charset=utf-8");
  echo "<?xml version='1.0' encoding='utf-8'?>".
     "<comments>".
     "<comment username='{$_REQUEST['username'] }' >".
     "<content>{$_REQUEST['content']}</content>".
     "</comment>".
     "</comments>";
?>

jQuery传递参数是相同的,区别在于回调函数对数据处理的方式的不同。从PHP代码中可以看出数据是以xml的格式传入的。

jQuery处理xml就像处理html一样,可以获取属性的值,也可以获取节点的值,获取这些值之后,就可以进行一定的处理,返回到页面中去。

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript 动态添加事件代码
Nov 30 Javascript
Ext第一周 史上最强学习笔记---GridPanel(基础篇)
Dec 29 Javascript
For循环中分号隔开的3部分的执行顺序探讨
May 27 Javascript
js实现绿白相间竖向网页百叶窗动画切换效果
Mar 02 Javascript
jquery弹出框插件jquery.ui.dialog用法分析
Aug 20 Javascript
js实现消息滚动效果
Jan 18 Javascript
微信小程序 实现动态显示和隐藏某个控件
Apr 27 Javascript
AngularJS实现的根据数量与单价计算总价功能示例
Dec 26 Javascript
微信小程序仿知乎实现评论留言功能
Nov 28 Javascript
关于RxJS Subject的学习笔记
Dec 05 Javascript
js与jquery获取input输入框中的值实例讲解
Feb 27 jQuery
基于Vue sessionStorage实现保留搜索框搜索内容
Jun 01 Javascript
Bootstrap基本样式学习笔记之表单(3)
Dec 07 #Javascript
jQuery删除当前节点元素
Dec 07 #Javascript
概述如何实现一个简单的浏览器端js模块加载器
Dec 07 #Javascript
jquery 标签 隔若干行加空白或者加虚线的方法
Dec 07 #Javascript
浅析js的模块化编写 require.js
Dec 07 #Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
Dec 07 #Javascript
纯JS焦点图特效实例(可一个页面多用)
Dec 07 #Javascript
You might like
PHP中遍历stdclass object的实现代码
2011/06/09 PHP
destoon实现调用当前栏目分类及子分类和三级分类的方法
2014/08/21 PHP
PHP浮点数精度问题汇总
2015/05/13 PHP
thinkPHP中验证码的简单使用方法
2015/12/26 PHP
更正确的asp冒泡排序
2007/05/24 Javascript
jQuery AjaxQueue改进步骤
2011/10/06 Javascript
node.js Web应用框架Express入门指南
2014/05/28 Javascript
javascript实现无限级select联动菜单
2015/01/02 Javascript
jquery简单实现外部链接用新窗口打开的方法
2015/05/30 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(三)
2016/09/14 Javascript
JavaScript错误处理操作实例详解
2019/01/04 Javascript
node.js ws模块搭建websocket服务端的方法示例
2019/04/25 Javascript
详解vue中的父子传值双向绑定及数据更新问题
2019/06/13 Javascript
mui js控制开关状态、修改switch开关的值方法
2019/09/03 Javascript
Vue基于iview实现登录密码的显示与隐藏功能
2020/03/06 Javascript
基于Vue+Webpack拆分路由文件实现管理
2020/11/16 Javascript
python3.6根据m3u8下载mp4视频
2019/06/17 Python
Python使用type关键字创建类步骤详解
2019/07/23 Python
Tornado实现多进程/多线程的HTTP服务详解
2019/07/25 Python
详解python中的生成器、迭代器、闭包、装饰器
2019/08/22 Python
妙用itchat! python实现久坐提醒功能
2019/11/25 Python
python requests模拟登陆github的实现方法
2019/12/26 Python
Python yield的用法实例分析
2020/03/06 Python
基于python计算滚动方差(标准差)talib和pd.rolling函数差异详解
2020/06/08 Python
python 读txt文件,按‘,’分割每行数据操作
2020/07/05 Python
利用纯css3实现的文字亮光特效的代码演示
2014/11/27 HTML / CSS
巴西图书和电子产品购物网站:Saraiva
2017/06/07 全球购物
Vertbaudet西班牙网上商店:婴儿服装、童装、母婴用品和儿童家具
2019/10/16 全球购物
C#中的验证控件有几种
2014/03/08 面试题
生物技术研究生自荐信
2013/11/12 职场文书
保健品市场营销方案
2014/03/31 职场文书
小学清明节活动总结
2014/07/04 职场文书
试用期员工工作自我评价
2014/09/10 职场文书
运动会广播稿200字
2015/08/19 职场文书
《神奇的鸟岛》教学反思
2016/02/22 职场文书
python如何获取网络数据
2021/04/11 Python