Question

我有：

test.json - 包含要上传到HTML页面的内容
test.js - 包含向JSON文件发送Ajax请求的函数，解析，编译Handelbars Temlate并将内容放入HTML页面（使用innerHTTML）。
addcontent.js - 从test.js文件
index.html - 包含Handlebars Template，Div 处理后将放置内容的位置，以及指向的内容 addcontent.js。

一切正常，如果在index.html内，则会直接指向test.js 如果我将代码包含在带有变量的函数中的test.js内，并在同一个文件中调用此函数，则一切正常。

但是，如果我从addcontent.js调用此函数并使用commonJS模块方法连接addcontent.js和test.js，则无效。可能我在某个地方犯了一个语法错误，但我没有看到它。

P.S。我使用NodeJS，NPM，HTTP-server，我将使用browserify合并所有javascript文件

＆＃13;

//test.js 

module.exports = function addContent (jsonDir, templId, finId){
function sendGet(callback) {
    /* create an AJAX request using XMLHttpRequest*/
    var xhr = new XMLHttpRequest();
    /*reference json url taken from: http://www.jsontest.com/*/

    /* Specify the type of request by using XMLHttpRequest "open", 
       here 'GET'(argument one) refers to request type
       "http://date.jsontest.com/" (argument two) refers to JSON file location*/
    xhr.open('GET', jsonDir);

    /*Using onload event handler you can check status of your request*/
    xhr.onload = function () {
        if (xhr.status === 200) {
            callback(JSON.parse(xhr.responseText));
        } else {
            alert(xhr.statusText);
        }
    };

    /*Using onerror event handler you can check error state, if your request failed to get the data*/
    xhr.onerror = function () {
        alert("Network Error");
    };

    /*send the request to server*/
    xhr.send();
}

//For template-1
var dateTemplate = document.getElementById(templId).innerHTML;
var template = Handlebars.compile(dateTemplate);

sendGet(function (response) {
    document.getElementById(finId).innerHTML += template(response);
})
}

＆＃13;

/* test.json */

{
   "time": "03:47:36 PM",
   "milliseconds_since_epoch": 1471794456318,
   "date": "08-21-2016-123",
    "test": "lalala 123"
}


/* addcontent.js */

var addContent = require('./test');

addContent("json/test.json", "date-template", 'testData');

＆＃13;

<!-- index.html -->

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="handlebars-v4.0.5(2).js"></script>
</head>

    
<body>
    
    <!-- template-1 -->
<div id="testData"></div>
<script id="date-template" type="text/x-handlebars-template">
  Date:<span> <b>{{date}}</b> </span> <br/> Time: <span><b>{{time}}</b>
    
    </span>
</script>
    
    

    <script type="text/javascript" src="addcontext.js"></script>
</body>
</html>

＆＃13;

我无法将javascript文件链接为commonjs模块

0 个答案: