Question

所以我有两个jquery函数，贝塞相同，但在2个单独的容器上。有没有办法将这两个功能结合起来。

$('#autobid-list .auction-button').click(
    function(){
        if($(this).attr('summary') == 'autobid-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == 'watchlist-button'){
            if($(this).hasClass('watchlist-1')){
                $(this).parents('li').clone().appendTo('#watchlist-list');
            }else{
                $('#watchlist-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
);

$('#watchlist-list .auction-button').click(
    function(){
        if($(this).attr('summary') == 'watchlist-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == 'autobid-button'){
            if($(this).hasClass('autobid-1')){
                $(this).parents('li').clone().appendTo('#autobid-list');
            }else{
                $('#autobid-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
);

这两个在贝司风格相同，唯一的变化是'autobid'或'watchlist'的输入

Answer 1

明显的答案：

$('#watchlist-list .auction-button').click(function(){
    whatever.call(this,'watchlist', 'autobid');
});
$('#autobid-list .auction-button').click(function(){
    whatever.call(this,'autobid', 'watchlist');
});

function whatever(one, two){
    if($(this).attr('summary') == one + '-button'){
        $(this).parents('li').addClass('none');
    }else if($(this).attr('summary') == two + '-button'){
        if($(this).hasClass(two + '-1')){
            $(this).parents('li').clone().appendTo('#' + two + '-list');
        }else{
            $('#' + two + '-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
        }
    }
}

虽然重新思考可能会更好。

编辑：糟糕，修复。

Answer 2

当然，只需确定点击了哪一个并根据该值分配变量。用逗号分隔时，您可以一次选择多个元素：

$('#watchlist-list .auction-button, #autobid-list .auction-button').click(function() {

    // Determine which button was clicked, you might want to adjust this as needed.
    var type = $(this).closest('#autobid-list').length > 0 ? 'autobid' : 'watchlist';

    // Then just replace 'autobid' and 'watchlist' with 'type'
    if($(this).attr('summary') == type+'-button') {
        $(this).parents('li').addClass('none');
    } else if($(this).attr('summary') == type+'-button') {
        if($(this).hasClass(type+'-1')) {
            $(this).parents('li')
                .clone()
                .appendTo('#'+type+'-list');
        } else {
            $('#'+type+'-list .auction-' + $(this).parents('table').attr('summary'))
                .parents('li')
                .addClass('none');
        }
    }
});

Answer 3

这可行吗？创建一个返回函数的函数：

function MyFunction(type) {
    return function(){
        if($(this).attr('summary') == type + '-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == type + '-button'){
            if($(this).hasClass(type + '-1')){
                $(this).parents('li').clone().appendTo('#' + type + '-list');
            }else{
                $('#' + type + '-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
}

$('#autobid-list .auction-button').click(MyFunction('autobid'));
$('#watchlist-list .auction-button').click(MyFunction('watchlist'));

通过组合这些函数来防止在javascript中进行代码复制

3 个答案: