問題描述

后臺給我的XML模板：<Pay>0,1,2</Pay>

<input type='checkbox' name='PayTypeList' class='PT1'>1<input type='checkbox' name='PayTypeList' class='PT2'>2<input type='checkbox' name='PayTypeList' class='PT3'>3<script>($('.PT1').is(’:checked’)==true)?PT1='0':PT1='';($('.PT2').is(’:checked’)==true)?PT2='1':PT2='';($('.PT3').is(’:checked’)==true)?PT3='2':PT3='';</script>

$('#textarea').html('<Pay>'+PT1+','+PT2+','+PT3+'</Pay>')

我用這種方法判斷后拼接但是如果最后一個選項未選擇那么前一個選項后面就跟了一個逗號，怎么辦

問題解答

聲明一個數組，如果某個checkbox被選中，就把值push進去，最后用join轉成以逗號分隔的數組。

var selected = []if ($('.PT1').is(’:checked’)) selected.push(’1’)// ... ...$('#textarea').html('<Pay>'+ selected.join() + '</Pay>')

樓上用正則表達式只能去除最后一個逗號，如果前面有沒選的，還是會有多余的逗號。

var str = '<Pay>'+PT1+','+PT2+','+PT3+'</Pay>';$('#textarea').html(str.replace(/,</Pay>$/, ’</Pay>’))回答3：

var array = new Array(); $('input').each(function (index) {if($(this).is(':checked')) { array.push(index);} }); $('#textarea').html('<Pay>'+array.join(',')+'</Pay>');回答4：

1.我理解你的需求是：只需要順序展示就可以，不考慮選中的順序。比如無論是先選中2還是先選中0，展示都是0，2;

我的解決辦法是,用數組去遍歷，至于遍歷方法可以很多：

方案1：用reduce（今天剛學了reduce，拿來玩玩）

<script>var arr = [PT1,PT2,PT3];var res = arr.reduce(function(pre,cur,arr){ if(pre!=’’&&cur!=’’){ return pre + ’,’ + cur;} else if(pre!=’’&&cur==’’){return pre;} else if(pre==’’ && cur!=’’){return cur;} else{return ’’;} })$('#textarea').html('<Pay>'+res+'</Pay>')</script>

方案2：用filter + join

<script>var arr = [PT1,PT2,PT3];var newarr = arr.filter(function(v,i){ return v==’’?false:true; })var res = newarr.join(’,’);$('#textarea').html('<Pay>'+res+'</Pay>')</script>

方案3：用for循環

<script>var arr = [PT1,PT2,PT3];var res = ’’;for(var i=0;i<arr.length;i++){if(arr[i]!=’’){ if(res!=’’){ res += ',' + arr[i]; }else{ res += arr[i];}}else{ continue;}}$('#textarea').html('<Pay>'+res+'</Pay>')</script>

2.如果考慮點擊順序，可以用change事件:當CheckBox改變時，判斷checked，以添加或者刪除數據html:

<input type='checkbox' name='PayTypeList' value=’0’ class='PT1'>1<input type='checkbox' name='PayTypeList' value=’1’ class='PT2'>2<input type='checkbox' name='PayTypeList' value=’2’ class='PT3'>3

javascript

var select = [];$(’[name=PayTypeList]’).change(function(e){ if(e.target.checked){select.push(e.target.value); }else{select = select.filter(function(v,i){ return v != e.target.value;}) }$('#textarea').html('<Pay>'+ select.join +'</Pay>')})

(借鑒了 huguangju 創建空數組的方法)

作為一個數組，去除數組種空值項，然后再格式化成字符串