今天讲一下如何很好的操控对于cs页面与aspx页面的参数的很好的利用的问题:很多和我一样开发的码农在开发的过程中会遇到,一些参数想使用但是不知道怎么使用的时候,这里我把我遇到的一些情况和大家分享一下,如果有争议,可以留言指出,再次先谢谢了。
首先我们都知道,在aspx页面一些input,radio,select都有id和name两个基本属性有时候前端在切页面的时候,顺便加上了,有的就忘了加,这时候我们可以根据id,来作为判断的标准可以很好的使用该属性的值,比如说:
<input type="text" name="title" id="title" value="hello" maxlength="60">
这是一个简单的输入框,我们可以清晰的看出,里面已经有了id和name,这时候,比如说,我们写的js里需要用到这个input里的值,我们可以这样写:
//function add(){
//var text=$("#title").val();
//}
这样,我们将这个aspx页面的id为title的里面的值赋予了刚才定义的text,这里text的值就为hello。
第二种情况:
<div class="indentBottmo">
<ul class="site">
<% for (int i = 0; i<a.Rows.Count;i++ )
{%>
<li <%if(a.Rows[i]["if_top"].ToString()=="1"){ %>class="siteSelect"<%}else{%><%}%> id="selectAddress" data-id="<%=a.Rows[i]["id"].ToString() %>" data-lid="<%=a.Rows[i]["userid"].ToString() %>" onclick ="ChangeSendAddress(this)">
<span>寄送至</span>
<p><%=a.Rows[i]["area"].ToString() %> <%=a.Rows[i]["address"].ToString() %>(<%=a.Rows[i]["username"].ToString() %> 收)</p>
<h4><%=a.Rows[i]["mobile"].ToString() %> <%if(a.Rows[i]["if_top"].ToString()=="0"){ %><%}else{%>默认地址<%}%></h4>
<nav data-id="<%=a.Rows[i]["id"].ToString() %>" id="<%=a.Rows[i]["userid"].ToString() %>" οnclick="ChangeAddress(this)" >修改本地址</nav>
</li>
<% }%>
<span οnclick="CleanFile()">使用新地址</span>
</ul>
</div>
这是一个常见的购物网站,买家选择收货地址的地方,这里实现的功能是,点击“修改本地址”的时候,会将参数带到一个弹窗框里,以便用户修改这个选择的地址的信息。这里我们就先将逻辑顺序理解清楚:
点击修改地址---弹出层-----修改完信息,点击保存----修改完成。
我们可以看到,在for循环的li标签里有一个onclick事件这个事件是在js里写好的一个方法,现在要得到两个参数,一个是用户的id和用户收货地址的id,来查询本次选择的这个地址的详细信息,这里看出在方法的括号里有一个this,这个的意思是说,我可以用这个标签里的数据,比如data-id,data-lid等。
js里是这样写的:
function ChangeAddress(obj) {//
var addressid = $(obj).attr("data-id");//获取data-id的值,并且赋值给addressid
var userid = $(obj).attr("id");
$.ajax({
url: "/a/a/a.aspx", // 后台请求路径
dataType: "json",
data: {
addressid: aid, userid: uid // 获取输入框内容
},
success: function (data) {//如果调取接口成功,将接口里面的值赋值给这个调用了本方法的页面的对于的id的标签的值
$("#pr1").val(data.province);//将省名称赋值给这个页面的这个id为pr1的标签的值。下面的同样,自己理解
$("#ci1").val(data.city);
$("#co1").val(data.county);
$("#address").val(data.address);
$("#postcode").val(data.postcode);
$("#accept_man").val(data.accept_man);
$("#accept_mobile").val(data.accept_mobile);
$("#addressid").val(data.addressid);
$("#setId").val(data.if_top);
layer.open({//这是一个弹窗效果,当数据接收成功了,同时将弹窗弹出来,这样就在视觉效果上感觉时点击修改地址,弹出弹窗,弹窗里的对应的标签都已值。
type: 1,
title: false,
closeBtn: 0,
shadeClose: true,
area: ['740px', '500px'],
content: $('.increase')
});
new locationCard({
ids: ['pr1', 'ci1', 'co1']
}).init();
new locationCard({
ids: ['pr2', 'ci2', 'co2']
}).init();
},
error: function () { console.log("错啦"); }
});
}
3.有的时候如果没有id,或者有id,但是这个id是在div,span等众多标签里,想用但是又怕使用的时候定义的不准确,或者好多地方都引用了众多的样式,导致指定不明确的情况,这样的情况我是这么处理的:
这里会用到第二种情况里的点击购买按钮的js功能:
function BuyProduct() {//
var addressid = $(".indentBottmo .site").children("li.siteSelect").attr("data-id"); //这里获取的是:class样式为’ .indentBottmo’ 标签里的class样式为’ .site’ 标签里的子li标签中class样式为‘ .siteSelect’ 的data-id里的值。
var userid = $(".indentBottmo .site").children("li.siteSelect").attr("data-lid");
var shman = "";//收货人
var address = "";//收货地址
var mobile = "";//收货人手机号
var pid = $("#pid").val();//使用的代金券
var ifbill = 0;//1开发票
var use_djq = $(".dikou .aeduction").children("#aeductionId").attr("data-id");//1.使用代金券
if (use_djq != 0) {
use_djq = 1;
}
else { use_djq = 0;}
var billhead = 0;//1个人、2单位
var company = $("#importInput").val();//公司名称
var company_name="公司"
if (company.indexOf(company_name)!=-1)
{
billhead = 2;
ifbill = 1;
}
else if (company != "") {
billhead = 1;
ifbill = 1;
}
else { billhead = 0;}
var prodnum = $("#numberSop").val();//购买数量
$.ajax({
url: "/a/a/a.aspx", // 后台请求路径
dataType: "json",
data: {
aid: aid, userid: userid // 获取输入框内容
},
success: function (data) {
//console.log(data);
address= data.province + " " + data.city + " " + data.county + " " + data.address;
shman= data.accept_man;
mobile = data.accept_mobile;
//console.log(addressid);
//console.log(userid);
//console.log(shman);
//console.log(address);
//console.log(mobile);
//console.log(pid);
//console.log(use_djq);
//console.log(billhead);
//console.log(prodnum);
//console.log(ifbill);
if (addressid != "0" && userid != "0" && shman != "" & address != "" & mobile != "" & pid != "0" & billhead != "0" & prodnum != "0") {
window.location.href = "/a/a.aspx?pid=" + pid + "& uid =" + userid + "&shman=" + shman + "&address=" + address + "&mobile=" + mobile + "&use_djq=" + use_djq + "&title=" + billhead + "&corpname=" + company + "&prodnum=" + prodnum + "&invoice="+ifbill+"";
} else { console.log("系统错误,错误代码:1-01"); }
},
error: function () { console.log("系统错误,错误代码:1-02"); }
});
4.有时候js里要使用cs页面的值,这种情况不能直接使用,而是只能在aspx页面定义一个隐藏的标签,我比较喜欢用一个隐藏的标签,然后让它的值为cs页面的值,然后在js里引用这个页面里的这个input的值,就可以了。
5.如果一个js里要用另一个js里的数据,而且第一个js要在成功的情况下才调用,则可以嵌套使用js并赋予对应的参数,即可达到这个目的。