Javascript Firebase更新电子邮件地址HTML表单_Javascript_Html_Firebase_Firebase Authentication

Javascript Firebase更新电子邮件地址HTML表单

javascript html firebase

Javascript Firebase更新电子邮件地址HTML表单,javascript,html,firebase,firebase-authentication,Javascript,Html,Firebase,Firebase Authentication,我正在创建一个HTML页面，用户可以在其中更新他们的电子邮件地址。我附加了一个事件侦听器，它将使用用户在表单中提供的电子邮件地址更新Firebase 下面的代码给出了一个错误：Uncaught TypeError:无法读取HtmlButtoneElement处null的属性'UpdateMail' 更新邮件出现在Firebase文档中，所以我很困惑。有什么我遗漏的吗？谢谢你的帮助 Js "use strict"; (function () { // get the form elements

我正在创建一个HTML页面，用户可以在其中更新他们的电子邮件地址。我附加了一个事件侦听器，它将使用用户在表单中提供的电子邮件地址更新Firebase

下面的代码给出了一个错误：Uncaught TypeError:无法读取HtmlButtoneElement处null的属性'UpdateMail'

更新邮件出现在Firebase文档中，所以我很困惑。有什么我遗漏的吗？谢谢你的帮助

"use strict";
(function () {

// get the form elements from HTML
var acctEmail = document.getElementById('acctEmail'),
    acctPassword = document.getElementById('acctPassword'),
    btnUpdate = document.getElementById('btnUpdate'),
    btnDeleteAcct = document.getElementById('btnDeleteAcct'),
    auth = firebase.auth(),
    user = firebase.auth().currentUser, // get the current user
    emailtoval = acctEmail.value, // get the email from acctEmail input field
    email = JSON.stringify(emailtoval); // convert email to json string


// update email
btnUpdate.addEventListener('click', function (e) {
     user.updateEmail(email).then(function() {
        // Update successful.
        }, function(error) {
          console.log(error);
         });
    });


})(); // end Js file wrapper

以下是HTML表单：

<!DOCTYPE html>
<html> 
<head> 
     <!-- head include -->
    <% include includes/head.ejs %>
</head>

<body id="accountbody">
    <!-- header include -->
    <% include includes/header.ejs %>

    <main>
        <h1> Manage Your Account </h1>

        <!-- begin account details form -->
        <h2>Update your account</h2>
        <div class="updateacctform">
            <input id="acctEmail" type="email" placeholder="Email">

            <input id="acctPassword" type="password" 
placeholder="Password">

            <button id="btnUpdate" class="updateacctbtn">Update
            </button>
        </div>

        <div>
            <h2>Delete your account</h2>
            <button id="btnDeleteAcct" class="deleteacctbtn"> Delete 
Account
            </button>
        </div>

    </main>

    <!-- footer include -->
    <% include includes/footer.ejs %>

    <!-- Js files -->
    <script src="javascripts/account.js"></script>
</body>
</html>


管理您的帐户
更新您的帐户
更新
删除你的帐户
删除
账户

我看不到您在哪里初始化Firebase应用程序实例。您也不是在等待当前用户准备就绪。您需要拨打以下电话：

// Initialize Firebase app.
firebase.initializeApp(config);
// Wait for auth state to be ready.
firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    // User is logged in. you can access firebase.auth().currentUser.
    // You can now perform operations on the user.
  } else {
    // No user logged in.
  }
});

我看不到您在哪里初始化Firebase应用程序实例。您也不是在等待当前用户准备就绪。您需要拨打以下电话：

// Initialize Firebase app.
firebase.initializeApp(config);
// Wait for auth state to be ready.
firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    // User is logged in. you can access firebase.auth().currentUser.
    // You can now perform operations on the user.
  } else {
    // No user logged in.
  }
});

谢谢，这帮了大忙。我让它工作了。我将在这里发布它作为对您答案的编辑。firebase.auth（）.onAuthStateChanged（函数（firebaseUser）{if（firebaseUser）{var newEmail=document.getElementById（'actemail'）。value；var user=firebase.auth（）.currentUser；user.updateEmail（newEmail）。然后（函数（）{//successful user.sendEmailVerification（）。然后（函数（）{//Email sent}，函数（error）{//error}；}，函数（error）{//error}；}）；谢谢，这帮了大忙。我让它工作了。我将把它作为您答案的编辑发布在这里。firebase.auth（）.onAuthStateChanged（函数（firebaseUser）{if（firebaseUser）{var newEmail=document.getElementById（'actemail'）。value；var user=firebase.auth（）.currentUser；user.updateEmail（newEmail）。然后（函数（）{//successful user.sendEmailVerification（）。然后（函数（）{//Email sent}，函数（error）{//error}；}，函数（error）{//error}；}）；