异步加载脚本？

Question

编辑：我想将表单输入数据保存到Firebase数据库中

使用id="field0"的输入框和onClick"submitPost()"的按钮提交数据。

<form>
<input id="field0" name="ePost" type="text" value="">
<button type="submit" class="btn" onclick="submitPost()">Submit</button>
</form>

无法将firebase.js放入头文件中，所以我是这样解决的。如果我逐个将片段添加到控制台中，似乎可以工作。但当我同时加载它们时，在控制台中会出现错误。

var script   = document.createElement("script");
script.type  = "text/javascript";
script.src   = "https://cdn.firebase.com/v0/firebase.js";
document.head.appendChild(script);

var myDataRef = new Firebase('https://eloquatest.firebaseio.com/');
myDataRef.on('child_added', function(snapshot) {
var post = snapshot.val();
});

function submitPost(e) {
var myDataRef = new Firebase('https://eloquatest.firebaseio.com/');
var name = $('#field0').val();
myDataRef.push({name: name});
$('#field0').val('');
}

以下是上面的示例：https://jsfiddle.net/hbaecklund/7mnns4dk/5/

我需要异步加载脚本才能工作吗？但以下内容不起作用？

$.ajax({
  url: 'https://cdn.firebase.com/v0/firebase.js',
  dataType: 'script',
  cache: true,
  success: function() {  
    var myDataRef = new Firebase('https://eloquatest.firebaseio.com/');
    myDataRef.on('child_added', function(snapshot) {
    var post = snapshot.val();
    });
    function submitPost(e) {
    var myDataRef = new Firebase('https://eloquatest.firebaseio.com/');
    var name = $('#field0').val();
    myDataRef.push({name: name});
    $('#field0').val('');
    };    
  }
});

- Hbaecklund

---

您可以使用 requirejs。 - Max

问题是你正在提交表单。你应该避免这样做，而是使用相关方法将数据发送到Firebase。但是，为什么你不能只是在头部包含Firebase脚本呢？ - A. Wolff

Answer 1

尝试使用脚本标签的load事件：https://jsfiddle.net/7mnns4dk/6/

基本上只需使用：

script.load = function() {
  // enter code that needs the script to be loaded here
}

同样，它可以与您编写的jQuery一起使用，只需将submitPost函数移动到按钮可以访问的位置即可：https://jsfiddle.net/7mnns4dk/7/

- Siderite Zackwehdex