3月14号笔记

jQuery:

用处：简化JavaScript的码字量。换言之，不会js，学jQuery==脑子有坑。

原理：它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计方式。

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script>
	$(function() {
		//获取超链接对象，并为其添加单击事件
		$("a").click(function() {
			alert("我的第一个jQuery脚本！");
		});
		$(".flip").click(function() {
			$(".panel").slideToggle("slow");
		});
		$("#updateContent").click(function(){
			$(".flip").html("谚语");
			$(".panel").html("<p>书山有路勤为径</p><p>学海无涯苦作舟</p>");
		});
		
	});
</script>

---

ajax：

用处：不用刷新页面，完成与后台交互。

原理：new一个XMLHttpRequest对象和后台交互，再把结果传给前台。

<script type="text/javascript">
	var xmlHttp = null;
	function showHint(str) {
		if (str.length == 0) {
			document.getElementById("txtHint").innerHTML = "";
			return;
		}
		try {
			xmlHttp = new XMLHttpRequest();
		} catch (e) {
			try {
				xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {
				alert("Your browser does not support XMLHTTP!");
				return;
			}
		}
		xmlHttp.onreadystatechange = function() {
			if (xmlHttp.readyState == 4) {
				if (xmlHttp.status == 200) {
					s = xmlHttp.responseText;
					names = s.split(",");
					h = "";
					for (i = 0; i < names.length; i++)
						h += names[i] + "<br/>";
					document.getElementById("txtHint").innerHTML = h;
				} else {
					alert(xmlHttp.status);
				}
			}
		}
		var url = "/JavaWeb/ajax?q=" + str;
		xmlHttp.open("GET", url, false);
		xmlHttp.send(null);
	}
</script>

---

json：

一种传输信息的格式，效率高。

$.ajax({			
	type:"GET",//请求类型
	url:path+"/jsp/provider.do",//请求的url
	data:{method:"pcexist",proCode:proCode.val()},//请求参数
	dataType:"json",//ajax接口（请求url）返回的数据类型
	success:function(data){//data：返回数据（json对象）
		if(data.proCode == "empty"){
			validateTip(proCode.next(),{"color":"red"},imgNo+ " 请输入供应商编码",false);
		}else if(data.proCode == "exist"){//账号已存在，错误提示
			validateTip(proCode.next(),{"color":"red"},imgNo+ " 该供应商编码已存在",false);
		}else{//账号可用，正确提示
			validateTip(proCode.next(),{"color":"green"},imgYes+" 该供应商编码可以使用",true);
		}
	},
	error:function(data){//当访问时候，404，500 等非200的错误状态码
		validateTip(proCode.next(),{"color":"red"},imgNo+" 您访问的页面不存在",false);
	}
});
//客户端到服务器

resp.setContentType("application/json");
PrintWriter writer = resp.getWriter();
writer.write(JSONArray.toJSONString(map));
//服务器到客户端