js--2.字符串拼接
1 原则
在html的页面,传递数据都是以字符串的形式
Js时间传递参数注意
单引号转义:
双引号:
最大原则:页面不要有空格
2 For循环的
2.1 多选按钮
2.1.1 返回html拼接
success: function (data) { var content =''; for(var i=0;i<data.data.length;i++) { content += '<input type="checkbox" name="perId" value="'+ data.data[i].id+ '"/>'+data.data[i].permissionName; content += '<br />' if((i + 1)%3 == 0) { content += '<br />' } } $("#role").html(content); },
2.1.2 Js获得
var perId = ''; $("input:checkbox[name='perId']:checked").each(function() { perId += $(this).val() + ","; }); perId = perId.substring(0 , perId.length -1);
2.1.3 Controller
这里是把string数组转化成为long数组
String[] ss = perId.split(","); Long [] longs = new Long[ss.length]; for(int i=0;i<ss.length;i++) { longs[i] = Long.parseLong(ss[i]); }
或者直接遍历,需要的时候对单个强制
2.2 超链接
2.2.1 返回html拼接
success: function (data) { var content1 = ""; for(var i = 0;i < data.data.length;i++) { content1 += '<a href="<%=path %>/controller/account/viewUser.do?role= ' +data.data[i].id + '">' + data.data[i].roleName +'</a> '; // console.log(content1); } $("#content").html(content1); },
2.3 单选按钮
2.3.1 返回html拼接
success : function(data) { var a =''; for(var i=0;i<data.length;i++){ a += '<input type="radio" name="bankName" value="'+ data[i]['fbId'] +'" /> '+data[i]['bankName'] +"("+ data[i]['bankNumber']+") <br /><br />"; } $('#tixian').html(a); }
2.3.2 js获得
var bankName=$('#tixianinput:radio[name="bankName"]:checked ').val();
2.4 下拉框
2.4.1 返回html拼接
success: function (data) { var op = ''; for(var i = 0 ; i < data.length ; i++ ){ op += '<option value="'+ data[i].id +'">'; op +=data[i].provinceCity; op += '</option>'; } $("#province").html(op); },
2.4.2 js获得值+文本
3 扩展:省市联动—下拉框
3.1 省获得—预加载
var provice='${user.province}'; //获得省 $.ajax({ url: "<%=path %>/controller/provinceCity/getAllProvince.do", type: "POST", dataType: "JSON", //返回类型 success: function (data) { var op = '<option value="-1" selected>全部</option>'; for(var i = 0 ; i < data.length ; i++ ){ op += '<option value="'+ data[i].id +'" '; if(data[i].provinceCity == provice) { op += ' selected '; } op += ' >'; op += data[i].provinceCity; op += '</option>'; } $("#province").html(op); //如果省有默认选中值,则触发市 var exProvince = $("#province option:selected").val(); if(exProvince != null && exProvince != '' || exProvince != "-1" ) { getCityByProvince(); } }, error: function(data) { alert("error:"+data.responseText); } }); });
3.2 Controller
3.3 省触发市
//根据省获得相应的市 function getCityByProvince() { var city = '${user.city}'; var provinceId = $("#province option:selected").val(); $.ajax({ url: "<%=path %>/controller/provinceCity/getCityByProvince.do", type: "POST", data:{ provinceId:provinceId }, dataType: "JSON", //返回类型 success: function (data) { var op = '<option value="-1" selected>全部</option>'; for(var i = 0 ; i < data.length ; i++ ){ op += '<option value="'+ data[i].cityId +'"'; if(data[i].city == city) { op += ' selected '; } op += ' >'; op += data[i].city; op += '</option>'; } $("#city").html(op); }, error: function(data) { alert("error:"+data.responseText); } }); }
3.4 Controller