前后台使用JavaScript交互参数。

众所周知,当我们使用jq时,前台与后台常用的参数传递,最常用的异步提交为ajax。这次介绍的主题就是在jq环境下 传递参数的问题。
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用于同步提交

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值