在另一個JavaScript文件中包含JavaScript文件

Question

我有兩個正在使用的JavaScript文件，我想一個包含另一個。

validate.js：

function validateEmail(userEmail) {
    var email = userEmail;
    var emailFilter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

    if (emailFilter.test(email)) {
    //alert('Please provide a valid email address');
        email.focus;
        return true;
    }
    else {
        return false;
    }
}

navigation.js

$(document).ready(function() {
    var imported = document.createElement('script');
    imported.src = 'lib/validation.js';
    document.head.appendChild(imported);

    console.log("DOCUMENT IS READY!");

    var viewsWrapper = $("#views-wrapper");
    var loginButton = $("#login-button");
    var registerButton = $("#register-button");

    // Login Link
    // TODO: Unclear if needed
    $("ul li.login").click(function() {
        $.get('/login', function(data) {
            viewsWrapper.html(data);
        });
    });

    $('#usernamefield').blur(function() {
        var sEmail = $('#usernamefield').val();
        if ($.trim(sEmail).length == 0) {
            alert('Please enter valid email address');
            e.preventDefault();
        }
        if (validateEmail(sEmail)) {
            alert('Email is valid');
        }
        else {
            alert('Invalid Email Address');
            e.preventDefault();
        }
    });
});

（還有更多不相關的代碼）

我已經使用這個網頁上描述的解決方案，試圖在這里

如上面的navigation.js（注釋區域）所示，但這不起作用。
我正在嘗試從navigation.js內調用validate.js中的validateEmail函數，但似乎無法做到這一點。 我見過的解決方案都沒有幫助。

任何幫助表示贊賞。

Answer 1

您不能以任何簡單的方式包含另一個JS文件。 但是您可以在使用它們的頁面中同時包含這兩個元素。 由於您的validateEmail函數看起來是全局的，因此另一個函數將簡單地引用它。

或者，您可以使用現有的許多模塊加載器之一。 我建議您將其保存以備后用，直到您可以解決此簡單問題為止。 但是，諸如Require.js及其同類之類的工具將允許一個模塊指定其對另一個模塊的依賴關系，並處理依賴關系的加載。

或按照@Jason的建議，您還可以使用腳本組合器，該組合器通常用於加速站點，方法是允許您使用多個文件進行開發，但可以使用單個文件進行部署。

但是實際上，首先，您需要研究基礎知識，這涉及到學習如何在網頁上使用腳本以及它們如何相互通信。

Answer 2

我建議使用許多JavaScript庫之一（例如YUI Compressor或Google Closure Compiler）將所有javascript文件合並為一個文件。 這些庫也將負責縮小/壓縮它們。

不要自己動手...