import {
getAuth,
createUserWithEmailAndPassword,
sendEmailVerification,
} from "https://www.gstatic.com/firebasejs/11.1.0/firebase-auth.js";
import { initializeApp } from "https://www.gstatic.com/firebasejs/11.1.0/firebase-app.js";
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
const firebaseConfig = {
//My firebase config
};
// Initialize Firebase and declare all variables
const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const emailfield = document.getElementById("email");
const email = emailfield.value;
const passwordfield = document.getElementById("password");
const password = passwordfield.value;
const loginbtn = document.getElementById("loginbtn");
loginbtn.addEventListener("click", (event) => {
event.preventDefault();
//log email and password
console.log(email);
console.log(password);
});
^
| JavaScript 代码
因此,我尝试使用 Firebase 身份验证设置登录应用程序,但遇到了此错误:
当我使用控制台记录“密码”和“电子邮件”的值时,我得到一个空字符串,但不是未定义的。
即使我在电子邮件和/或密码字段中输入某些内容,我也会收到此错误。
这是 HTML 代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Sample Account Page</title>
<link rel="stylesheet" href="styleaccount.css" />
<link
href="https://unpkg.com/[email protected]/css/boxicons.min.css"
rel="stylesheet"
/>
<script type="module" src="../scripts/accounthandler.js" defer></script>
</head>
<body>
<div class="wrapper">
<form>
<h1>Login</h1>
<div class="input-box">
<input type="email" placeholder="Email" id="email" />
<i class="bx bxs-user"></i>
</div>
<div class="input-box">
<input type="password" placeholder="Password" id="password" />
<i class="bx bxs-lock-alt"></i>
</div>
<div class="remember-forgot">
<label><input type="checkbox" />Remember me</label>
<a href="#">Forgot Password?</a>
</div>
<button type="submit" id="loginbtn" class="btn">Login</button>
<div class="register-link">
<p>
Don't have an Account?
<a href="register.html">Register</a>
</p>
</div>
</form>
</div>
</body>
</html>
我尝试了以下方法:
更改 HTML 元素的 ID(和 JS 代码)
我还尝试获取元素的文本而不是值
您的问题是,一旦代码运行、页面加载,您就会捕获
passwordfield
和 emailfield
的值。您需要在“点击”事件中分配值,如下所示:
loginbtn.addEventListener("click", (event) => {
event.preventDefault();
//log email and password
const password = passwordfield.value;
const email = emailfield.value;
console.log(email);
console.log(password);
});