所以我最近一直在使用 Firebase,我遇到了一个问题,我需要一些帮助来解决。所以我试图将用户输入的数据发送到 Firebase,并让该数据显示在指定的 div 中,但数据没有显示在我的 Firebase 或那个 div 中......
这是我的 HTML 代码:
<form>
<input name="name" class="form-control" type="name" placeholder="Title" id="titleInput" />
<br/>
<textarea id="postInput" name="content" data-provide="markdown" rows="10"></textarea>
<hr/>
<button type="submit" class="btn" onclick="submitPost()">Submit</button>
</form>
还有我的 JQuery 代码(已编辑):
function submitPost() {
var myDataRef = new Firebase('https://EXAMPLE.firebaseio.com/');
var name = $('#titleInput').val();
var text = $('#postInput').val();
myDataRef.push({name: name, text: text});
$('#postInput').val('');
myDataRef.on('child_added', function(snapshot) {
var post = snapshot.val();
displayUserPost(post.name, post.text);
})
function displayUserPost(name, text) {
$('<div/>').text(text).prepend($('<em/>').text(name+': ')).appendTo($('#PostsDiv'));
$('#PostsDiv')[0].scrollTop = $('#PostsDiv')[0].scrollHeight;
}
};
最佳答案
您正在处理异步数据流,因此您应该在 submitPost 函数之外监听数据。
var myDataRef = new Firebase('https://EXAMPLE.firebaseio.com/');
myDataRef.on('child_added', function(snapshot) {
var post = snapshot.val();
displayUserPost(post.name, post.text);
});
function submitPost(e) {
var myDataRef = new Firebase('https://EXAMPLE.firebaseio.com/');
var name = $('#titleInput').val();
var text = $('#postInput').val();
myDataRef.push({name: name, text: text});
$('#postInput').val('');
e.preventDefault();
}
function displayUserPost(name, text) {
$('<div/>').text(text).prepend($('<em/>').text(name+': ')).appendTo($('#PostsDiv'));
$('#PostsDiv')[0].scrollTop = $('#PostsDiv')[0].scrollHeight;
}
关于javascript - 无法将数据推送到 Firebase onclick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34158930/