Po kliknięciu wyświetla się wiadomość i po 2 sekundach znika

JS  Założony przez  Patryk Stefański.

Witam !
Jestem słaby w js bo nigdy się nim nie interesowałem, ale teraz go potrzebuje.
Tak wygląda struktura
ROOT/pages/register.php


Chce, aby po kliknięciutego inputa(submit) wyświetliła się informacja w ROOT/index.php?p=home.php Bo tam prowadzi formularz

Ale też chce aby wiadomość pokazała się po ok 0,5sekundzie i na 2sekundy.
Probówałem to zrobić sam, ale coś mi kompletnie nie wychodzi.
I pokazują się błędy
register_btn_success.addEventListener("click", setTimeout(alertSuccess, 500), false); ->Uncaught TypeError: Failed to execute 'addEventListener' on 'EventTarget': The callback provided as paremetr 2 is not an object
alert_success.style.opacity = "1"; -> Uncaught TypeError: Cannot read property 'style' of null

Kod html
<div class="alert success" style="display: none">
         <strong>Success!</strong> Indicates a successful or positive action.
  </div>
I javascript

//Pobiera inputa
var register_btn_success = document.querySelector("#register_btn");
//Nasłuchuje klikniecia

register_btn_success.addEventListener("click", setTimeout(alertSuccess, 500), false);

//Nie pytać
function TimeOut(n, p) {
  setTimeout(p() {

  }, n)
}

//Funkcja chowająca alert'a
function alertSuccess() {
  var alert_success = document.querySelector(".alert");
  alert_success.style.opacity = "1";
  alert_success.style.display = "block";
  setTimeout(function() {
    alert_success.style.opacity = "0";
    setTimeout(function() {
      alert_success.style.display = "none";
    }, 2000);
  }, 2000);
}
Skoro formularz prowadzi na nową stronę, co powoduje odświeżenie page'a, to po co nasłuchujesz czy button został kliknięty?
Na nowej stronie pokaż komunikat taki jaki chcesz i po X czasu go ukryj.

$(document).ready(function () {
  setTimeout(function() {
    var $hiddenAlerts = $('.alert:hidden');
    $hiddenAlerts.show();
  }, 500);
  
  setTimeout(function() {
    var $visibleAlerts = $('.alert:visible');
    $visibleAlerts.hide();
  }, 2500);
});
Mam błąd "SyntaxError: expected expression, got ')'" wps.js:10:2
kod
$(document).ready(function() {
    setTimeout(function() {
      var $hiddenAlerts = $('#alertSucces:hidden');
      $hiddenAlerts.show();
    }, 500);
    setTimeout(function() {
      var $visibleAlerts = $('#alertSucces:visible');
      $visibleAlerts.hide();
    }, 2500);
  )
}
Podałeś że masz taki HTML:
<div class="alert success" style="display: none">
To po co zamieniłeś tam na ID?

+ źle skopiowałeś mój kod.
(28.04.2019, 17:41)Patryk Stefański napisał(a): Mam błąd "SyntaxError: expected expression, got ')'" wps.js:10:2
kod
$(document).ready(function() {
    setTimeout(function() {
      var $hiddenAlerts = $('#alertSucces:hidden');
      $hiddenAlerts.show();
    }, 500);
    setTimeout(function() {
      var $visibleAlerts = $('#alertSucces:visible');
      $visibleAlerts.hide();
    }, 2500);
  )
}
Na końcu zamykasz nawias okrągły a za nim klamrowy, zamień je.
Cytat:w pół dnia stałeś się lepszym pytonistą niż kawenanowo kiedykolwiek programisto :3 ~ Riess 13.11.2018 16:28
Cytat:ale z tą nazwą to fyeem ma racje  ~ Divir 29.07.2019 16:08
Bo pewnie będę używał wielu alertów i dałem go na id
<div id="alertSucces" class="alert success" style="display: none">
Wybacz, faktycznie źle skopiowałem.
Ale jak teraz zrobić, aby kod wywołał się tylko po kliknięciu submita w register.php ?
(28.04.2019, 17:50)Patryk Stefański napisał(a): Bo pewnie będę używał wielu alertów i dałem go na id
To jak wielu, to nie [id] a [class] ;)

(28.04.2019, 17:50)Patryk Stefański napisał(a): Ale jak teraz zrobić, aby kod wywołał się tylko po kliknięciu submita w register.php ?
Do akcji ROOT/index.php?p=home.php dopisz kolejny parametr, np. register=1. Co w rezultacie da taki url:
ROOT/index.php?p=home.php&register=1
Usunąłem "id"
i dodałem if, który sprawdza to co przesłano $_GET i działa



Użytkownicy przeglądający ten wątek:

1 gości