ajax向后台传递参数-动态组织json串

水深无声 2022-07-13 00:09 176阅读 0赞

ajax提交json格式的本质是提交了如下格式的参数："&name=123&password=456"，而且这种格式下，name和passowrd都可以是变量赋值，但是使用\{“name”:value\}格式的话，这里的name是不能为变量的，只有value可以是变量。

1、index.jsp

<form action="<%=basePath%>register/register.action" method="post" id="formid">
    		用户名：<input type="text" name="userName" id="userName" class="mark"/><br /> 
    		<input type="submit" value="提交" /><br />
    	</form>

2、register.js

$(function(){
    	//我们不知道name或者id ,只通过class获取元素的id和name以及value,动态获取这些值的话，不能使用{变量：变量}提交，只能使用"&"+变量1+"="+变量2的形式，因为ajax仅支持 {"常量"：变量}的json格式
    	$(".mark").blur(function(){checkUserName2(this)});
    });
    
    //提交表单的ajax
    function checkUserName2(theid){
    	
    	//data="&"+id+"="+value是ajax的本质模式,这里id是一个变量,比如 id="userName",等同于 data={userName:value}={'userName':value},二者 的区别是{}中的key不能为变量
    	//var data="&"+id+"="+value;
    	var data=gainJson(theid);
    	
    		$.ajax({
    			url : "register/checkUserName.action",// 请求地址
    			//timeout : 600000,//超时时间设置，单位毫秒
    			async : false,// 异步
    			cache : false,// 缓存
    			type : 'post',// 请求方式
    			/*data: $('#formid').serialize(),//序列化表单*/			
    			data:data,						
    			dataType : 'json',// 服务器返回的数据类型
    			contentType:"application/x-www-form-urlencoded; charset=utf-8",
    			success : function(msg) {// 请求成功后调用的
    				if(msg.result=="true"){
    					//去除非法提示
    					alert("true");
    				}else{
    					//增加非法提示
    					alert("false");
    				}
    			
    			},
    			
    			error :function(){
    			alert("异常");
    			}
    		});
    
    	};
    
    	//获取id和值的公共方法，返回json格式
    	function gainJson(theid){
    		var id=$(theid).attr("id");
    		var value=$("#"+id+"").val();
    		var str="&"+id+"="+value;
    		return str;
    	}