jQuery:映射选项值

时间:2013-06-25 10:35:29

标签: javascript jquery html map

我有一个像这样的选择列表 -

<select>
    <option value='A,textA$$B,textB' data-id='1'>some text</option>
    <option value='C,textC$$D,textD' data-id='2'>some text</option>
</select>

我想把这个字符串作为输出 -

1-1-A-textA,2-1-B-textB,3-2-C-textC,4-2-D-textD
  • 1 - 只是一个像1,2,3,4 ..
  • 的索引
  • 1 - data-id
  • A - ,
  • 之前的文字
  • textA - ,
  • 之后的文字

我试过这个(但是,我知道这是不完整的,因为我不能超越这个)

var s = $('select option').map(function(){
   return this.value.split('$$').join(',');
}).get();

小提琴 - http://jsfiddle.net/NgQzH/2/

3 个答案:

答案 0 :(得分:2)

它并不像看起来那么简单。一旦我意识到每个元素的索引递增,我就不得不创建一个包装器函数。地图如何汇总数组很酷 - 我不知道它是这样做的。此方法还有一个额外的好处,就是能够正确处理输入值,例如C,textC$$D,textD$$E,textE

jsFiddle

function createArray() {
    var globalIndex = 1;
    var s = $('select option').map(function(index, elem){
        var ary = this.value.split('$$');
        for (i = 0, il = ary.length; i < il; i++) {
            ary[i] = (globalIndex++) + '-' + $(this).attr('data-id') + '-'
            +  ary[i].replace(',', '-');
        }
        return ary;

    }).get();
    return s.join();
}

console.log(createArray());

答案 1 :(得分:0)

这是对你小提琴的快速而肮脏的修复

var s = $('select option').map(function(index, element){
       return (index+1) + "-" + $(element).data('id')  + "-" + this.value.split('$$').join('-').replace(/,/g,'-');
}).get();

http://jsfiddle.net/NgQzH/4/

答案 2 :(得分:0)

试试这个,

var i=1;
var arr=new Array();
$('select option').each(function(index,value){
    f=$(this).val();
    fr=f.split('$$');
    fr1=fr[0].split(',');
    fr2=fr[1].split(',');
    j=1;
    arr.push(i+'-'+j+'-'+fr1[0]+'-'+fr1[1]);
    i++;j++;
    arr.push(i+'-'+j+'-'+fr2[0]+'-'+fr2[1]);
    i++;
});
console.log(arr.join(','));

Working fiddle

<强>更新

var s='';
var i=1;
var j=1;
var arr=new Array();
$('select option').each(function(index,value){
    f=$(this).val();
    fr=f.split('$$');
    fr1=fr[0].split(',');
    fr2=fr[1].split(',');

    arr.push(i+'-'+j+'-'+fr1[0]+'-'+fr1[1]);
    i++;
    arr.push(i+'-'+j+'-'+fr2[0]+'-'+fr2[1]);
    i++;j++;
});
console.log(arr.join(','));

小提琴 http://jsfiddle.net/NgQzH/8/