'plese help me. javascript > about preventDefault

  1. question hello, I just got into JavaScript In the code below, "preventDefault();" could not be executed.I'd really appreciate it if you could tell me what the problem is. I entered the code "preventDefault" but the page still reloads. I thought I typed it well, but I don't know where the problem is.

  2. code ====html====

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="cstyle.css">
</head>

<body>

    <div class="js-clock">
        <h1>00:00</h1>
    </div>
    <form action="" class="js-form form showing"> <input type="text" placeholder="What is your name?"></form>
    <h4 class="js-greetings greetings"></h4>
    <script src="c.js"></script>
    <script src="greeting.js"></script>

</body>

</html>

====js====

const form = document.querySelector(".js-form"),
    input = form.querySelector("input"),
    greeting = document.querySelector(".js-greetings");

const USER_LS = "currentUser",
    SHOWING_CN = "showing";

function saveName(text) {
    localStorage.setItem(USER_LS, text);
}

function handleSubmit(event) {
    event.preventDefault();
    const currentValue = input.value;
    paintGreeing(currentValue);
    saveName(currentValue);
}




function askForName() {
    form.classList.add(SHOWING_CN);
    form.addEventListener(
        'submit', handleSubmit);

}

function paintGreeing(text) {
    form.classList.remove(SHOWING_CN);
    greeting.classList.add(SHOWING_CN);
    greeting.innerText = `hello ${text}`;

}

function loadName() {
    const currentUser = localStorage.getItem(USER_LS);
    if (currentUser === null) {
        // she is not
    } else {
        paintGreeing(currentUser);
        // she is
    }
}


function init() {
    loadName();

}
init();
javascripthtml


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions