ajax使用总结，包括跨域

原生ajax

		<script type="text/javascript">
			var s1 = document.getElementById("select1");
			var s2 = document.getElementById("select2");
			var tab= document.getElementById("mytable");
			s2.onchange = function() {
				$("#mytable").find("tbody").remove();
				var parme1 = s1.options[s1.selectedIndex].value;
				var parme2 = s2.options[s2.selectedIndex].value;
/* 				console.log(parme1);
				console.log(parme2); */
				var xhr = new XMLHttpRequest();
				xhr.open("POST","searchClassTable?");
				xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
				
				xhr.onreadystatechange = function() {
					if (xhr.readyState == 4 && xhr.status == 200) {
						console.log("成功")
						var res=JSON.parse(xhr.responseText);
						console.log(res);
						var tbody=null;
						var m=h=total=0;
						for(var i=0;i<res.length;i++){
							if(m==0){
								m=res[i]['Xh'];
							}
							if(m==res[i]['Xh']){
								total=(parseFloat(total)+parseFloat(res[i]['Integral'])).toFixed(1);
								h++;
							}
							else{
								console.log("total"+total);console.log("h:"+h);
								total=0;h=1;
								total+=parseFloat(res[i]['Integral']);
							}
							var j=(i+1)>=res.length?i:i+1;
							if(res[i]['Xh']==res[j]['Xh'] && (i!=res.length-1)){
								tbody+="<tr><td id='xh'>"+(i+1)+"</td><td>"+res[i]['Xh']+"</td><td>"+res[i]['Xm']+"</td><td>"+res[i]['Major']+"</td><td>"+res[i]['Title']+"</td><td>"+res[i]['Integral']+"</td></tr>";
							}else{
								tbody+="<tr><td id='xh'>"+(i+1)+"</td><td>"+res[i]['Xh']+"</td><td>"+res[i]['Xm']+"</td><td>"+res[i]['Major']+"</td><td>"+res[i]['Title']+"</td><td>"+res[i]['Integral']+"</td></tr><tr><td colspan='5' class='total'></td><td class='total'>"+res[i]['Xm']+"总学分:"+total+"</td></tr>";
							}
							//tbody+="<tr><td id='xh'>"+(i+1)+"</td><td>"+res[i]['Xh']+"</td><td>"+res[i]['Xm']+"</td><td>"+res[i]['Major']+"</td><td>"+res[i]['Title']+"</td><td>"+res[i]['Integral']+"</td><td>"+"预留占位"+"</td></tr>";
							m=res[i]['Xh'];
						}
						
						$("#mytable").append("<tbody>"+tbody+"</tbody>");
					}
				}
				xhr.send("parme1="+parme1+"&parme2="+parme2); 
			}
		</script>

jquery的ajax

function flesh(){
		$.ajax({
			url:"http://www.hongyundy.com/jk.php",
			method:"post",
			data:$("#f_can").serialize(),
			success:function(res){
				console.log(res);
				$("#title_lm").text(res[0]);
				$("#count").text("共"+res[1]+"个系列");
				$(".m2-C").html("");
				var str="";
				for($i=0;$i<res[2].length;$i++){
					var img_url=res[2][$i]['img_sl']==""?res[2][$i]['pic_sl']:res[2][$i]['img_sl'];
					str+="<div class='m2-Cl'><a href='pro_show-"+res[2][$i]["id"]+".html'><div class='left'><img src='"+img_url+"'></div><div class='right'><div class='m2-Cl-rp ny1-1-rp'><p class='first'>"+res[2][$i]["title"]+"</p><p>"+res[2][$i]["keyword"]+"</p></div></div><div class='hoverf'><div class='m2-Cl-rp ny1-1hf'><p class='first'>HBA 10-60W</p><p>"+res[2][$i]["title"]+"<br>"+res[2][$i]["keyword"]+"</p></div></div></a></div>";
				}
				$(".m2-C").html(str);
			},
			error:function(res){
				console.log(res);
			}
		})
}

知识点：

JSON.parse() 方法用于将一个 JSON 字符串转换为对象。
JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。
serialize()方法通过序列化表单值
var data=$("#f").serialize();

前端跨域的一些解决方法

自定义回调函数名

知识点：
jsonp指定发送到后端的Callback名
jsonpCallback可以指定自定义函数回调名，不指定则默认为success

后端解决跨域的代码

callback后端

后端post跨域–cross解决跨域

后端get跨域–cross解决跨域