javascript - 重写一个立即调用的函数

Question

我有一个来自 AWeber 的脚本，用于弹出窗体，我想对其进行一些自定义......

它当前在页面加载时打开弹出窗口。我希望它作为按钮的点击事件运行。

问题是:它使用立即调用的函数。而且由于我是新手并且还不熟悉这种模式，所以我无法弄清楚。我读过它，但我仍然不完全理解它。

因此，我尝试将脚本重写为一个简单的模式，但它不起作用!

那么，你能帮我弄清楚我的新功能有什么问题吗？

和/或为我简化/解释其他功能？

第一个函数:

(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//forms.aweber.com/form/id.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, "script", "aweber-wjs-formid")

我的尝试(jQuery):

function createAweberScript() {
    var script=document.createElement('script');
    script.type='text/javascript';
    script.id='aweber-wjs-formid';
    script.src='//forms.aweber.com/form/id.js';
    jQuery('body').append(script);
}

jQuery(document).ready(function () {
    jQuery( 'a.button' ).click(createAweberScript);
});

Answer 1

只需将立即调用的函数包装在常规函数中，然后在 click 处理程序中调用该函数:

function createAweberScript() {
    // start Aweber script
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//forms.aweber.com/form/id.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, "script", "aweber-wjs-formid"));
    // end Aweber script
}

jQuery(document).ready(function () {
    jQuery('a.button').click(createAweberScript);
});

你可以把它拆开并编写你自己的函数，是的，但这更容易理解和维护:如果 Aweber 函数发生变化，你只需要替换 createAweberScript() 中的所有内容函数来更新它。

注意:我得到了 http://forms.aweber.com/form/id.js 的 404；我假设那不是您要使用的 URL。如果是这样，您可能需要检查一下。