前后台使用JavaScript交互参数。

来源:互联网 发布:sass编译是什么源码 编辑:程序博客网 时间:2024/06/06 07:31

众所周知,前台与后台常用的参数传递,最常用的异步提交为ajax。这次介绍的主题就是 传递参数的问题。
1.基础形式异步交互数据:

var options={    type:"post",    url:"",    dataType:"json",    data:{"data1":data1,"data2":data2,.......},    success:function(data){    //对传递过来的data进行操作    }}$.ajax(options)

这个是最基础的版本。接下来介绍利用ajax传递数组。
2.ajax异步传递数组。

var options={    type:"post",    url:"",    traditional: true,    dataType:"json",    data:{"data1":data1,"data2":data2,.......},    success:function(data){    //对传递过来的data进行操作    }}$.ajax(options)

如上加入traditional: true,属性即可。这样就可以传递数组了。当然你也可以通过拼接字符串进行传递。
3.使用post,get,getJSON方法异步请求。

$.post({"www.baidu.com",{"data1":data1,"data2":data2",.....},function(data){//处理参数}});$.get({"www.baidu.com",{"data1":data1,"data2":data2",.....},function(data){//处理参数}})$.getJSON({"www.baidu.com",{"data1":data1,"data2":data2",.....},function(data){//处理参数}})

4.使用ajaxsubmit提交form表单

var options={        url:"",        type:"",        data:{"data1":data1,"data2":data2,.....},        seccess:function(data){        //处理参数        }       }    $("#form").ajaxSubmit(options)

该方法主要用来处理带有表单数据的提交。
5.post虚拟表单进行提交

//创建虚拟表单function virtualPost(URL, PARAMS) {    var temp = document.createElement("form");    temp.action = URL;    temp.method = "post";    temp.style.display = "none";    for (var x in PARAMS) {        var opt = document.createElement("textarea");        opt.name = x;        opt.value = PARAMS[x];        // alert(opt.name)        temp.appendChild(opt);    }    document.body.appendChild(temp);    temp.submit();    return temp;}//调用 virtualPost("www.baidu.com",{"data1":data1,"data2":data2,....})

该方法用于向后台提交参数,进行处理,或者请求转发。
6.使用地址栏拼接参数提交

//上一个页面提交location.href=url+"?params1="+params1+"&params2="+params2//下一个页面取值function GetQueryString(name) {    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");    var r = window.location.search.substr(1).match(reg);    if(r!=null)return  unescape(r[2]); return null;}GetQueryString("targetId")//使用

上述方法既可实现跳转。也可以实现后台请求转发。

上述6种1-4用于异步提交,5-6用于同步提交