创建数组函数jQuery

时间:2015-11-16 00:02:32

标签: jquery dry

我有以下代码:

$(document).on('change', 'input.authority-email', function() {

    var authorityValues = $(this);

    var authorityArray = [].map.call(authorityValues, function (authorityValues) {
        return authorityValues.value;
    }).join(',');

    $('input#team_authority_emails').val(authorityArray);
});

$(document).on('change', 'input.member-email', function() {

    var memberValues = $(this);

    var memberArray = [].map.call(memberValues, function (memberValues) {
        return memberValues.value;
    }).join(',');

    $('input#team_member_emails').val(memberArray);
});

我的想法是,这个过程不是很干,可能是一个单独的功能吗?

[].map.call(memberValues, function (memberValues) {
  return memberValues.value;
}).join(',');

var authorityArray = [].map.call(authorityValues, function (authorityValues) {
  return authorityValues.value;
}).join(',');

创建可以创建和返回数组的函数的最佳方法是什么?或者我可以对此做出任何其他改进吗?

2 个答案:

答案 0 :(得分:1)

从概念上讲,您希望执行单向绑定。

来自一组输入的所有值都将映射到指定的单个输入。

这是一个解决方案:

function bindValuesToTarget(sourceSelector, targetSelector) {
    var writeValuesToTarget = function() {
       var valuesString= [].map.call($(sourceSelector), function (arrayItem) {
           return arrayItem.value;
       }).join(',');

       $(targetSelector).val(valuesString);
    }        

    $(document).on(
      'change',
      $(sourceSelector),
      writeValuesToTarget
    );

    // You might want to do this the first time, 
    // just in case it never changes
    writeValuesToTarget();
}

bindValuesToTarget('input.member-email', 'input#team_member_emails');
bindValuesToTarget('input.authority-email', 'input#team_authority_emails');

答案 1 :(得分:0)

$(document).on('input', 'input.authority-email', function() {
    var valCommas = this.value.replace(/\s+/, ",");  // "a,b,c,foo,bar"
    $('#team_authority_emails').val( valCommas );
});

用一个逗号替换一个或多个空格