在jQuery/JavaScript中使用显示模块模式

我正在我的网站上重新使用一些工具提示功能

我正在试验显示模块模式，如下所示：

作为快速测试，我尝试了以下方法：

var tooltip = function(){

    var foobar = 'foo and bar';

    function getAlerter(){
        return alert(foobar);
    }

    return{
        alerter: getAlerter
    }

}();

tooltip.alerter();

它会按预期提醒“foo和bar”

但是，我需要传递触发工具提示功能的元素，如下所示：

var tooltip = function(elem){

    var trigger = elem;

    function getAlerter(){
        return alert(trigger);
    }

    return{
        alerter: getAlerter
    }

}();

tooltip.alerter('.trigger');

---

但这返回的是未定义的。我不确定原因：（

因为您返回的是警报的结果，而不是触发器的值。

这是因为您正在使用立即执行函数（

（）

，在“模块”末尾），并且在声明和执行函数时，没有传递任何值

您可以告诉

getAlerter

函数接受附加参数：

function getAlerter(trigger){
   // your getter code...
}

但它质疑了你模式背后的整个理念。 如果您希望在指定元素的情况下调用模块，则最有可能的结果如下：

var tooltip = function(elem){
    // your whole module code...
}('.trigger');

var myTooltip = tooltip('.alerter');
myTooltip.alerter();

tooltip.init('.alerter');
tooltip.alerter();

或者，如果需要多个实例，请删除“模块”末尾的

（）

，并按如下方式运行：

var tooltip = function(elem){
    // your whole module code...
}('.trigger');

var myTooltip = tooltip('.alerter');
myTooltip.alerter();

tooltip.init('.alerter');
tooltip.alerter();

如果希望将其作为单个实例，可以轻松添加

init

方法：

var tooltip = function(elem){

    var trigger;

    function getAlerter(){
        return alert(trigger);
    };

    function init(elem) {
        trigger = elem;
    }
    return{
        alerter: getAlerter,
        init: init
    }
}();

然后像这样运行它：

var tooltip = function(elem){
    // your whole module code...
}('.trigger');

var myTooltip = tooltip('.alerter');
myTooltip.alerter();

tooltip.init('.alerter');
tooltip.alerter();

这边

var tooltip = function(elem){

    function getAlerter(trigger){
        return alert(trigger);
    }

    return{
        alerter: getAlerter
    }

}();

tooltip.alerter('.trigger');

---

我太仓促了！@wildcard的想法是对的

var tooltip = function (elem) {

    var trigger = elem;

    function getAlerter () {
        alert (trigger);
        return trigger;
    }

    return {
        alerter: getAlerter
    };
};

var q= tooltip ('.trigger');
q.alerter ();

---

谢谢你的透彻解释。我想这已经让人质疑（就像你说的）我为什么要这样做。我认为这可能对我的谨慎有点过分，但我只是想尝试一下，你知道：）在这和所有的答案中，有一个小缺陷-应该将函数声明为“vars”，以维护隐私，否则，它们将显示为全局。