我一整天都尝试了不同的解决方案，但无法让表单将用户输入内容写入 Firebase。这些规则目前对所有人开放，所以我知道这不是问题。这是三个单独页面上的三步注册过程，但是，第一步(或第一页上的用户输入)不会写入数据库，而其他步骤则工作正常，并且我已经以相同的方式进行了设置。
在这一点上，我完全迷失了，因为我已经尝试了一切。
这是我的 JS:
var mvrName = document.getElementById("name");
var mvrAddress = document.getElementById("address");
var mvrZip = document.getElementById("zip");
var mvrPhone = document.getElementById("phone");
var mvrEmail = document.getElementById("email");
var _mvrName, _mvrAddress, _mvrZip, _mvrPhone, _mvrEmail;
var date = Date();
window.onload = function() {
document.getElementById('nextBtn').onclick = function() {
_mvrName = mvrName.value;
_mvrAddress = mvrAddress.value;
_mvrZip = mvrZip.value;
_mvrEmail = mvrPhone.value;
_mvrPhone = mvrEmail.value;
var firebaseRef = firebase.database().ref();
firebaseRef.child("Contact Info").push({
Name: _mvrName,
Address: _mvrAddress,
Zip: _mvrZip,
Email: _mvrEmail,
Phone: _mvrPhone,
Date_Created: date
});
secondStep();
};
};
function secondStep() {
window.location.href = 'companyInfo.html';
}
如果我删除“secondStep()”方法调用，则数据会写入 Firebase，但如果不这样做，则单击按钮时会转到下一页，但数据不会写入 Firebase。
这是我的 HTML:
<head>
<script src="https://www.gstatic.com/firebasejs/4.2.0/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
...
};
firebase.initializeApp(config);
</script>
<!-- Loading Goodle Places Library -->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=...&libraries=places"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
<nav>...</nav>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<h4>Contact Details</h4>
<input class="inputs" id="name" name="name" placeholder="Name" />
<input class="inputs" id="address" name="address" placeholder="Street Address" />
<input class="inputs" id="zip" name="zip" placeholder="Zip" />
<input class="inputs" id="phone" name="phone" placeholder="Phone" />
<input class="inputs" id="email" name="email" placeholder="Email"/>
</div>
<button id="nextBtn"></button>
</div>
</div>
<script src="contactInfo.js"></script>
</body>
</html>
就像我说的，我一整天都在尝试将这部分用户输入写入 Firebase，但点击按钮却没有成功，除非我删除转到下一页的功能，但这是我的最终目标写下然后将它们带到下一页。
最佳答案
您需要等待数据库写入完成，然后才能转到下一页。
实现此目的的一种常见方法是使用 push() 返回的 Promise。写入完成后，将调用 Promise 的 then() 方法，您可以安全地更改窗口位置:
var firebaseRef = firebase.database().ref();
firebaseRef.child("Contact Info").push({
Name: _mvrName,
Address: _mvrAddress,
Zip: _mvrZip,
Email: _mvrEmail,
Phone: _mvrPhone,
Date_Created: date
}).then(function() {
secondStep();
});
其余代码可以保持不变。
关于javascript - 用户输入未写入 Firebase，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45646155/