如何从jQuery扩展的插件方法外部访问其内部定义的PrintErrorSummary函数

PrintErrorSummary 和 errorList 是 $.fn.Val_Rev2 函数内部的私有成员，默认作用域仅在函数内部，外部无法直接访问。可以通过以下几种方式实现外部调用：

方案1：将公开方法挂载到jQuery实例上（推荐，兼容jQuery链式调用习惯） #

修改插件代码，把需要对外暴露的方法绑定到当前jQuery对象实例：

(function ($) {
    $.fn.Val_Rev2 = function (containerId) {
        let container = document.getElementById(containerId);
        let allFields = container.querySelectorAll("[is-required]");
        let errorList = [];

        // 其他原有逻辑....
        
        function PrintErrorSummary() {
            // 原有逻辑
        }

        // 挂载公开方法
        this.PrintErrorSummary = PrintErrorSummary;
        // 支持链式调用
        return this;
    }
}(jQuery));

调用方式：

// 初始化插件时保存实例
const validator = $(this).Val_Rev2("container");

// 按钮点击事件中直接调用
$("#你的按钮ID").on("click", function () {
    validator.PrintErrorSummary();
});

方案2：返回独立的公开API对象 #

如果不需要支持jQuery链式调用，可以直接返回包含公开方法的对象：

(function ($) {
    $.fn.Val_Rev2 = function (containerId) {
        let container = document.getElementById(containerId);
        let allFields = container.querySelectorAll("[is-required]");
        let errorList = [];

        // 其他原有逻辑....
        
        function PrintErrorSummary() {
            // 原有逻辑
        }

        // 返回公开接口
        return {
            PrintErrorSummary,
            // 可选：封装方法获取错误列表，避免外部直接修改内部状态
            getErrorList: () => [...errorList]
        }
    }
}(jQuery));

调用方式：

// 初始化时获取API对象
const valApi = $(this).Val_Rev2("container");

// 按钮点击时调用
$("#你的按钮ID").on("click", () => valApi.PrintErrorSummary());

方案说明 #

你原本考虑的「传入按钮ID内部绑定点击事件」的方案也可正常使用，适合仅需要在按钮点击场景触发方法、不需要对外暴露方法的场景，代码耦合度更低。

内容的提问来源于stack exchange，提问作者Chris