JQuery与Ajax【json篇】

最新推荐文章于 2022-08-02 17:00:10 发布

空丶

最新推荐文章于 2022-08-02 17:00:10 发布

阅读量573

点赞数

文章标签： jquery ajax json

本文链接：https://blog.csdn.net/Hyc_20/article/details/44025599

版权

JSON基本概念

JSON：JavaScript对象表示法（JavaScript Object Notation）。

JSON是存储和交换文本信息的语法，类似XML。它采用键值对的方式来组织，易于人们阅读和编写，同时也易于机器解析和生成。

JSON是独立于语言的，也就是说不管什么语言，都可以解析，只需要按照json的规则来就行。

JSON语法规则

JSON数据的书写格式是：名称/值对

名称/值对组合中的名称写在前面（在双引号中），值对写在后面（同样在双引号中），中间用冒号隔开。

json的值可以是下面这些类型：

数字（整数或浮点数）

字符串（在双引号中）

逻辑值（true或false）

数组（在方括号中）

对象（在花括号中）

null

在WEB数据传输过程中，json是以文本，即字符串的轻量级形式传递的，而客户端一般用JS操作的是接收到的JSON对象，所以，JSON对象和JSON字符串之间的相互转换、JSON数据的解析是关键。

先明确2个概念例如：

JSON字符串:

var str = '{ "name": "aa", "sex": "man" }';

JSON对象:

var obj= { "name": "bb", "sex": "man" };

可以简单这样理解：

JSON对象是直接可以使用JQuery操作的格式，如C#中可以用对象（类名）点出属性（方法）一样；

JSON字符串仅仅只是一个字符串，一个整体，不截取的话没办法取出其中存储的数据，不能直接使用，除非你只想alert()它。

一、JSON字符串转换为JSON对象

A：eval函数【eval方式可以转换标准和非标准格式字符串】

eval函数可以直接将本质符合或者近似符合JSON格式的字符串转换为JSON对象，使用方式如：

eval('(' + str + ')');

B：parseJSON函数

另一种将标准字符串转换为JSON对象的函数是parseJSON()，使用方式如jQuery.parseJSON(str);

C：JSON.parse函数

还有一种将标准字符串转换为JSON对象的函数是JSON.parse()，使用方式如JSON.parse(str);

特别注意：如果obj本来就是一个JSON对象，那么使用eval（）函数转换后（哪怕是多次转换）还是JSON对象，但是使用parseJSON（）函数处理后会有问题（抛出语法异常）。

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

【实例】

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>AjaxDemo</title>
<script src="js/jquery-1.8.3.min.js"></script>
<script>
	$(document).ready(function() {
		$("#number").blur(function() {
			var number = $("#number").val();
			$.ajax({
				url : "server.jsp",
				type : "post",
				data : {
					"number" : number
				},
				dataType : "json",
				success : function(json) {
					$("#myDiv").html(json.msg);
				},
				error : function() {
					alert("Ajax执行失败！");
				}
			});
		});
	});
</script>
</head>
<body>
	<h3>验证数字是否为0~10之间？</h3>
	<input type="text" id="number" />
	<div id="myDiv" style="color: red; display: inline;"></div>
</body>
</html>

server.jsp

<%
	int num = Integer.parseInt(request.getParameter("number"));
	if (num >= 0 && num < 10) {
		out.print("{\"msg\":\"Yes\"}");
	} else {
		out.print("{\"msg\":\"No\"}");
	}
%>

空丶

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery与Ajax【json篇】

JSON基本概念JSON：JavaScript对象表示法（JavaScript Object Notation）。JSON是存储和交换文本信息的语法，类似XML。它采用键值对的方式来组织，易于人们阅读和编写，同时也易于机器解析和生成。JSON是独立于语言的，也就是说不管什么语言，都可以解析，只需要按照json的规则来就行。JSON语法规则JSON数据的书写格式是：名称/
复制链接

扫一扫