Przyciski przesyłania

Część sekcji JavaScript w praktyce ścieżki HTML w Coddy. Lekcja 7 z 27.

Przyciski przesyłania są niezbędnymi elementami formularzy HTML, które umożliwiają użytkownikom wysyłanie danych formularza na serwer w celu ich przetworzenia.

Utwórz podstawowy formularz HTML z przyciskiem wysyłania:

<form id="myForm">
  <input type="text" placeholder="Enter your name">
  <button type="submit">Submit</button>
</form>

Atrybut type="submit" określa, że kliknięcie przycisku powinno spowodować wysłanie formularza.

Możesz również użyć JavaScriptu do obsługi wysyłania formularzy:

const form = document.getElementById('myForm');

form.addEventListener('submit', function(event) {
  event.preventDefault(); // Zapobiega domyślnemu przesłaniu formularza
  console.log('Form submitted!'); // To wyświetla komunikat w konsoli
});

Metoda preventDefault() zatrzymuje tradycyjne wysyłanie formularza, umożliwiając obsłużenie wysłania za pomocą JavaScript.

Wyzwanie

Łatwy

Twoje zadanie:

Dodaj do formularza przycisk Submit z atrybutem type="submit"
W procedurze obsługi zdarzenia submit użyj zmiennej message, aby ustawić treść tekstową na "Submitted successfully"

Spróbuj swoich sił

<!DOCTYPE html>
<html>
<head>
  <title>Submit buttons</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <form id="myForm">
    <h2>Sign Up</h2>
    <input type="text" id="email" placeholder="Enter your email">
    <p id="emailMessage" class="message"></p>

  </form>
  <script src="script.js"></script>
</body>
</html>