公路边的怪叔叔

公路边的怪叔叔的日常

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

 

 

 

阅读更多
个人分类: js
上一篇java--1.非空判断
下一篇js--3.交互方式
想对作者说点什么? 我来说一句

vb.net json 字符串拼接

2017年07月25日 78KB 下载

TestCrash例子

2011年08月25日 6.99MB 下载

将两字符串连接,中间有空格

2011年11月14日 448B 下载

拼接字符串

2014年03月08日 135KB 下载

没有更多推荐了,返回首页

关闭
关闭