#javascript #html
#javascript #HTML
Вопрос:
мой код приведен ниже —
var userName_cookie = document.cookie.split("; ").find(row => row.startsWith("username")).split("=")[1];
function noUserName() {
console.log("noUserName()");
document.getElementById("known").style.display = "none"; // make sure that the known div is hidden
document.getElementById("not-known").style.display = "block";
document.getElementById("submit-btn").onclick = function() {
console.log("Submit btn clicked")
userName_cookie = document.getElementById("enter-name").value;
userNameKnown();
}
}
function userNameKnown() {
// add user name to cookie
userName_cookie = document.getElementById("enter-name").value;
document.getElementById("not-known").style.display = "none"; // make sure that the unknown div is hidden
document.getElementById("known").style.display = "block";
// edit known div to show username
document.getElementById("hello").innerText = `Hello, ${userName_cookie}`
// time (good morning, good evening etc.)
var date = new Date();
var hours = date.getHours();
if(hours < 12) {
document.getElementById("time").innerText = `Good Morning`;
} else if(hours == 12) {
document.getElementById("time").innerText = `Good Noon? or Afternoon, shall I say?`;
}
else if(hours > 12 amp;amp; hours <= 16) {
document.getElementById("time").innerText = `Good Afternoon`;
} else if(hours > 16) {
document.getElementById("time").innerText = `Good Evening`;
}
document.getElementById("known").style.display = "block";
}
if(userName_cookie === undefined) {
noUserName();
} else {
userNameKnown();
}
#not-known {
display: block;
text-align: center;
font-size: 40px;
}
#not-known > input {
color: black;
font-size: 30px;
}
#submit-btn:hover {
cursor: pointer;
}
#known {
font-size: 40px;
text-align: center;
display: none;
}
<!-- Hello, What is your name -->
<div id="not-known">
<p>Hello, What is your name?</p>
<input type="text" placeholder="Enter your name here" id="enter-name">
<input type="button" value="submit" id="submit-btn">
</div>
<!-- If known -->
<div id="known">
<p id="hello">Hello,</p>
<p id="time">Good</p>
</div>
Он находится на домашней странице моего сайта, https://aaditya-baduni.github.io /. Как вы можете видеть в конце кода JS, if(userName_cookie === undefined) {noUserName();}
кажется, что функция noUserName() не запущена, так как я не могу отобразить «известный» div.
Я должен сохранить имя пользователя как файл cookie. Что я хочу, чтобы имя было зарегистрировано как cookie при нажатии на тег ввода отправки, отображение неизвестного div должно быть установлено как «нет», а отображение известного div должно быть установлено как «блок» (функция userNameKnown () должна быть запущена)
Ответ №1:
Ваш код, считывающий файл cookie, выдаст ошибку, прежде чем вы перейдете к if
инструкции:
document.cookie.split("; ").find(row => row.startsWith("username")).split("=")[1];
Если .find()
не будет получено никаких совпадений, он вернется undefined
, что означает, что вы вызываете undefined.split()
, что приведет к ошибке.
Простой способ исправить это — использовать условную цепочку:
document.cookie.split("; ").find(row => row.startsWith("username"))?.split("=")[1];
?
Перед .split()
проверкой проверяет, что он не пытается вызвать функцию undefined
, и предотвратит ошибку и позволит продолжить выполнение кода для выполнения вашего оператора if.