尝试制作可重用的代码,使用函数参数填充名为 target 的变量的区域

Trying to make reusable code, using the function parameter to fill in the areas of the variable named target

本文关键字:填充 参数 区域 变量 target 函数 代码      更新时间:2023-09-26

尝试制作可重用的代码,使用函数参数填充名为target的变量的区域。 我什至不确定我是否可以以这种方式使用它。

加工:

function loadBtn() {
    sizeOfPartnersList = $("#partners div.partner-wrapper").size();
    x=4;
    $('#partners div.partner-wrapper:lt('+x+')').css('display', 'table');
    $('.load-more-btn').click(function () {
        x= (x+4 <= sizeOfPartnersList) ? x+4 : sizeOfPartnersList;
        $('#partners div.partner-wrapper:lt('+x+')').css('display', 'table');
        var numberOfVisiblePartners = $('div.partner-wrapper:visible').size();
        if ( numberOfVisiblePartners ===  $("#partners div.partner-wrapper").size()) {
            $('.load-more-btn').hide();
        };
    });
}
$(document).ready(function () {
    loadBtn();
});

不工作:

function loadBtn(target) {
    // target = target;
    sizeOfPartnersList = $("#partners div." + target).size();
    x=4;
    $('#partners div.'+ target ':lt('+x+')').css('display', 'table');
    $('.load-more-btn').click(function () {
        console.log('loading-02');
        x= (x+4 <= sizeOfPartnersList) ? x+4 : sizeOfPartnersList;
        $('#partners div.'+ target ':lt('+x+')').css('display', 'table');
        var numberOfVisiblePartners = $('div.'+ target ':visible').size();
        if ( numberOfVisiblePartners ===  $("#partners div." + target).size()) {
            $('.load-more-btn').hide();
        };
    });
}
$(document).ready(function () {
    loadBtn('partner-wrapper');
});

字符串中存在一些错误,在连接字符串和变量时始终需要使用+

$('#partners div.'+ target ':lt('+x+')')

应该是

$('#partners div.'+ target +':lt('+x+')')

这里也一样:

$('#partners div.'+ target ':lt('+x+')').css('display', 'table');
var numberOfVisiblePartners = $('div.'+ target ':visible').size();

更改为:

$('#partners div.'+ target +':lt('+x+')').css('display', 'table');
var numberOfVisiblePartners = $('div.'+ target +':visible').size();

请注意每行中target后添加的+

完整代码:

function loadBtn(target) {
    sizeOfPartnersList = $("#partners div." + target).size();
    x=4;
    $('#partners div.'+ target +':lt('+x+')').css('display', 'table');
    $('.load-more-btn').click(function () {
        console.log('loading-02');
        x= (x+4 <= sizeOfPartnersList) ? x+4 : sizeOfPartnersList;
        $('#partners div.'+ target +':lt('+x+')').css('display', 'table');
        var numberOfVisiblePartners = $('div.'+ target +':visible').size();
        if ( numberOfVisiblePartners ===  $("#partners div." + target).size()) {
            $('.load-more-btn').hide();
        };
    });
}
$(document).ready(function () {
    loadBtn('partner-wrapper');
});