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中匿名函数,函数直接量和闭包
May 08 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
Jan 15 Javascript
JavaScript中prototype为对象添加属性的误区介绍
Oct 15 Javascript
浏览器的JavaScript引擎的识别方法
Oct 20 Javascript
调用HttpHanlder的几种返回方式小结
Dec 20 Javascript
不同编码的页面表单数据乱码问题解决方法
Feb 15 Javascript
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Apr 01 Javascript
js实现根据身份证号自动生成出生日期
Dec 15 Javascript
BootstrapTable refresh 方法使用实例简单介绍
Feb 20 Javascript
ES6新特性之解构、参数、模块和记号用法示例
Apr 01 Javascript
vue.js实现回到顶部动画效果
Jul 31 Javascript
vue实现购物车加减
May 30 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的ob_start() 控制您的浏览器cache
2009/08/03 PHP
PHP 伪静态隐藏传递参数名的四种方法
2010/02/22 PHP
smarty模板引擎中内建函数if、elseif和else的使用方法
2015/01/22 PHP
浅谈json_encode用法
2015/03/05 PHP
8个PHP数组面试题
2015/06/23 PHP
PHP实现的简单路由和类自动加载功能
2018/03/13 PHP
学习ExtJS table布局
2009/10/08 Javascript
js 判断一个元素是否在页面中存在
2012/12/27 Javascript
自己封装的常用javascript函数分享
2015/01/07 Javascript
jQuery热气球动画半透明背景的后台登录界面代码分享
2015/08/28 Javascript
基于Javascript实现弹出页面效果
2016/01/01 Javascript
vue+iview写个弹框的示例代码
2017/12/05 Javascript
JS实现中英文混合文字溢出友好截取功能
2018/08/06 Javascript
微信小程序实现一个简单swiper代码实例
2019/12/30 Javascript
vscode 配置vue+vetur+eslint+prettier自动格式化功能
2020/03/23 Javascript
在Angular中实现一个级联效果的下拉框的示例代码
2020/05/20 Javascript
js实现随机圆与矩形功能
2020/10/29 Javascript
Python输出9*9乘法表的方法
2015/05/25 Python
分析Python中设计模式之Decorator装饰器模式的要点
2016/03/02 Python
python实现的二叉树定义与遍历算法实例
2017/06/30 Python
python 创建弹出式菜单的实现代码
2017/07/11 Python
在Python中使用defaultdict初始化字典以及应用方法
2018/10/31 Python
详解Python进阶之切片的误区与高级用法
2018/12/24 Python
python3 pillow模块实现简单验证码
2019/10/31 Python
美国知名平价彩妆品牌:e.l.f. Cosmetics
2017/11/20 全球购物
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
Pretty Green美国:英式摇滚服饰风格代表品牌之一
2019/01/23 全球购物
阿迪达斯希腊官方网上商店:adidas希腊
2019/04/06 全球购物
Mountain Warehouse波兰官方网站:英国户外品牌
2019/08/29 全球购物
高三毕业生自我鉴定
2013/12/20 职场文书
销售顾问岗位职责
2014/02/25 职场文书
2014年班组建设工作总结
2014/12/01 职场文书
后天观后感
2015/06/08 职场文书
大学生村官工作心得体会
2016/01/23 职场文书
Python 实现定积分与二重定积分的操作
2021/05/26 Python
nginx配置文件使用环境变量的操作方法
2021/06/02 Servers