Question

我想制作一个所选元素的集合，而不是。

dom元素由几个multiple select组成他们每个人都有相同的用户我的目标是创建所有用户的集合，并为所选用户添加具有特定值的属性。

这是我的代码js代码（1），这里是链接http://jsfiddle.net/vxRtb/9/。

我的代码有效，但我想干掉代码，因为可能只需要在第一个选择中删除就不需要所有用户。
任何提示如何干燥以下js代码？
请阅读有关js代码的评论以获取更多信息;感谢

P.S .:
1）我正在使用jQuery和underscore
2）从服务器我得到html代码，与jsfiddle.net/vxRtb/9相同

$(function () {
    var $selectElements = $('form .controls select');
    var userCollection = []; 

    // Subroutine_1
    // TODO Subroutine_1 and Subroutine_2 seems too close; any idea how to dry this code?
    $.each($($selectElements[0]), function (i, teamElement) {
        var $users = $(teamElement).find('option')

        $.each($users, function (i, user) {
            userCollection.push({
                id: $(user).val(),
                name: $(user).text(),
            });            
        });
    });

    // Subroutine_2
    $.each($selectElements, function (i, teamElement) {
        var $teamElement = $(teamElement);
        //var teamId = $teamElement.attr('id');
        var teamName = $teamElement
            .parent().parent().closest('.controls')
            .find('input').val();
        var $users = $teamElement.find('option:selected');

        $.each($users, function (i, user) {
            _.where(userCollection, {id: $(user).val()})[0].team = teamName;           
        });
    });

    console.log(userCollection);
});

Answer 1

这是一个相当陈旧的问题，你可能已经离开了它，但是，我尝试了这个，这就是我想出来的。

分析

循环非常相似，一个循环的关键差异构建了团队成员，另一个循环计算出他们的团队。我认为DRY选项只使用一个循环并测试成员是否有团队。由于用户ID不是唯一的，因此需要重复，因此需要应用一些逻辑。

伪代码

根据<option>标记创建用户对象集合。
1. 使用getMyTeam生成团队名称
按ID分组用户对象。
过滤仅使用团队名称
过滤没有团队名称的用户对象以仅显示uniq记录

代码

我不确定这是否更好。在性能方面，由于所有嵌套，这应该相当差。但是，我认为优点是代码变得更加模块化，您可以根据需要轻松更改规则。 jsFiddle

$(function () {

    // Helper to find a team based on an options element
    function getMyTeam() {
        if (this.is(':selected')) {
            var select = this.parent();
            var teamId = select.attr('id').replace(/_participations$/, '_name');
            return $('#' + teamId).val();
        }
        return undefined;
    };

    // Helper to return an object's id
    function getId(obj) {
        return obj.id;
    };

    // Helper to filter the team members by team name.
    function filterMembersByTeam(members) {
        var result = _.filter(members, function(record) {
            return !_.isUndefined(record['team']);
        });
        if (result.length === 0) { 
            result = _.uniq(members, true, function(member) {
                return JSON.stringify(member);
            })
        };
        return result;
    };

    // 1. Select the users
    var options = $('form .controls select option');

    // 2. Build up the user data
    var userCollection = _.map(options, 
                          function(option) {
                            return { 
                                    id: $(option).val(),
                                    name: $(option).text(),
                                    team: getMyTeam.apply($(option)) 
                                };
                          }); 

    // 3. Clean & filter the user data
    userCollection = 
        _.flatten( 
            _.map( _.groupBy(userCollection, getId), filterMembersByTeam) 
        );

    console.log(userCollection);
});

构建所选元素的集合，而不是

1 个答案:

分析

伪代码

代码