JavaScript--9.字符串拼接

来源:互联网 发布:高仿mcm怎么在淘宝买 编辑:程序博客网 时间:2024/05/01 17:05

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

 

 

 

原创粉丝点击