jQuery 之 param 与 post 方法（14）

最新推荐文章于 2024-07-15 03:08:42 发布

稚枭天卓

最新推荐文章于 2024-07-15 03:08:42 发布

阅读量1.7k

点赞数

分类专栏： AJAX入门 jQuery 入门 JavaWeb贴士文章标签： post param 序列化对象 jQuery ajax

本文链接：https://blog.csdn.net/u013630349/article/details/51983179

版权

JavaWeb贴士同时被 3 个专栏收录

70 篇文章 0 订阅

订阅专栏

jQuery 入门

33 篇文章 0 订阅

订阅专栏

AJAX入门

18 篇文章 1 订阅

订阅专栏

jQuery param() 方法

定义和用法

param() 方法创建数组或对象的序列化表示形式。

序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

语法

$.param(object,trad)

object 必需。规定要序列化的数组或对象。

trad 可选。布尔值，指定是否使用参数序列化的传统样式

输出序列化对象的结果：

<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  personObj=new Object();
  personObj.firstname="John";
  personObj.lastname="Doe";
  personObj.age=50;
  personObj.eyecolor="blue";
  $("button").click(function(){
    $("div").text($.param(personObj));
  });
});
</script>
</head>
<body>
<button>序列化对象</button>
<div></div>
</body>
</html>

===================================================

jQuery post() 方法

定义和用法

$.post() 方法使用 HTTP POST 请求从服务器加载数据。

语法

$(selector).post(URL,data,function(data,status,xhr),dataType)

URL

必需。规定将请求发送到哪个 URL。

data

可选。规定连同请求发送到服务器的数据。

function(data,status,xhr)

可选。规定当请求成功时运行的函数。

额外的参数：

data - 包含来自请求的结果数据

status - 包含请求的状态（"success"、"notmodified"、"error"、"timeout"、"parsererror"）

xhr - 包含 XMLHttpRequest 对象

dataType

可选。规定预期的服务器响应的数据类型。

默认地，jQuery 会智能判断。

可能的类型：

"xml" - 一个 XML 文档

"html" - HTML 作为纯文本

"text" - 纯文本字符串

"script" - 以 JavaScript 运行响应，并以纯文本返回

"json" - 以 JSON 运行响应，并以 JavaScript 对象返回

"jsonp" - 使用 JSONP 加载一个 JSON 块，将添加一个 "?callback=?" 到 URL 来规定回调

===================================================

实例 1

使用 HTTP POST 请求从服务器加载数据：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.post("/try/ajax/demo_test_post.php",
    {
      name:"菜鸟教程",
      url:"http://www.runoob.com"
    },
    function(data,status){
      alert("数据: \n" + data + "\n状态: " + status);
    });
  });
});
</script>
</head>
<body>
<button>发送一个 HTTP POST 请求页面并获取返回内容</button>
</body>
</html>

实例 2

使用 AJAX 的 POST 请求来改变 <div> 元素的文本：

<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("input").keyup(function(){
    txt=$("input").val();
    $.post("demo_ajax_gethint.php",{suggest:txt},function(result){
      $("span").html(result);
    });
  });
});
</script>
</head>
<body>
<p>在以下输入框中输入名字:</p>
First name:
<input type="text" />
<p>匹配项: <span></span></p>
<p>该实例的PHP代码 (<a href="demo_ajax_gethint.txt" target="_blank">demo_ajax_gethint</a>) </p>
</body>
</html>