hoe ik kan na submit klikken in de form ( boodschap dat u email is ontvangen ) wegdoen met JS code?
ik wil na de form is submitted de boodschap dat u email is ontvangen na paar seconden weg hebben.
ik heb deze code bestudeerd en geprobeerd van alle mogelijke sitauaties.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script>
document.addEventListener('DOMContentLoaded', function () {
let container = document.querySelector('.success'),
form = document.querySelector('#contact');
if (form != null) {
form.addEventListener('submit', function () {
setTimeout(function(){
container = document.querySelector('.succes');
if (container == null) return; // abort if element isn't available
container.style.display = 'none';
}, 10000);
});
}
});
</script>
document.addEventListener('DOMContentLoaded', function () {
let container = document.querySelector('.success'),
form = document.querySelector('#contact');
if (form != null) {
form.addEventListener('submit', function () {
setTimeout(function(){
container = document.querySelector('.succes');
if (container == null) return; // abort if element isn't available
container.style.display = 'none';
}, 10000);
});
}
});
</script>
ik heb ook deze lijn weggedaan:
Code (php)
1
document.addEventListener('DOMContentLoaded', function () {
omdat :
The DOMContentLoaded fires when the DOM content is loaded, without waiting for images and stylesheets to finish
loading.
ik heb stap bij stap bestudeerd ik weet wat is querysellector,setTimeout,etc.
ik zie zelf geen enkele fout .
kan iemand corrigeren deze code .
mij form heeft een id (contact) en mij message heeft een klas (success)
dank u wel
Gewijzigd op 25/07/2022 14:04:42 door - Ariën -
Persoonlijk vind ik verdwijnende succes-berichten niet echt handig. Als als iemand even wegkijkt?
Dan ziet die niet of het bericht succesvol verstuurd is. Ik houd meer van een permanente melding totdat het wordt weggeklikt.
ik ga morgen proberen.ik heb u bericht net gezien ik krijgde geen melding van mij iphone. ik zat beetje in w3school bepaalde termen bestuderen. het lijkt dat jquery is makkelijker dan javascript. maar ik hou soms van moeilijke dingen.
ik zie dat bij stackOverflow de meeste antwoorden kloppen niet.
ik heb hier jquery code :
Code (php)
1
2
3
4
5
2
3
4
5
<script type="text/javascript">
jQuery(document).ready(function($){
$(".success").delay(10000).fadeOut(1000); // change 5000 to number of seconds in milliseconds
});
</script>
jQuery(document).ready(function($){
$(".success").delay(10000).fadeOut(1000); // change 5000 to number of seconds in milliseconds
});
</script>
maar die ook werkt niet. het is makkelijker dan JS.
deze tekst : IJ bent de programmeur, dus JIJ moet je afvragen waarom je ergens een link plaatst. Je moet niet zomaar ergens code kopiëren en plakken. Je moet weten WAAROM je iets doet.
ik kopier van nergens iets zomaar . ik zoek in google voor soort gelijke problemen en oplossingen en dat doet iedereen.ik heb een Nederlandse vriend die is 35 jaar java programeurgeweest en hij werkte voor amerikaanse bedrijf (geponsioneerd)hij heeft weleens tegen mij gezegd ik kopier soms van internet bepaalde antwoorden.
ik zoek mensen in forums die hebben zelfde probleem gehad net als mij. ik bestudeer hun problemen en de antwoorden .
ik zoek overal voor logische uitlegging. in de youtube in de w3school in geeks for geeks,stackOverflow Wordpress etc.
de forums is bedoeld om oplossingen te zoeken en iemand die heeft meer ervaring of gespecialiseerd in bepaalde onderwerp om antwoord te geven en niet alleen adviesen !.
de forum is bedoeld om concrete antwoorden te geven net als student en mentor en niet alleen adviesen . ik heb van niemand advies nodig ik ben bijna 62 jaar en ik heb heleboel day trading gedaan in CFD ik heb geen advies nodig .als iemand wil mij beantwoorden hert is goed . wil niet beantwoorden dat is ook goed. geen probleem.
vroeger ik zat jaren in microsoft forum en altijd ik heb antwoord gehad met de juiste oplossing
ik zit hele dag te bestuderen en vooroplossing te zoeken . ik wil helemaal onafhankelijk zijn en zoveel mogelijk niemand een vraag stellen. .
ik ga geen programeur worden ik ben bezig met Wordpress . ik kan alle problemen oplossen met Wordpress maar ik wilde voor 1 keer contact form maken zelf anders ik gebruik plug in .
voor paar kleine dingen ik ga niet jacascript of php leren alleen basis kennis hebben is voldoende.en dat ik ga doen en ik ben mee bezig.
a.u.b vortaan geen aadviesen meer.heb jij geen antwoord geen probleem maar geen adviesen .
Johannes davidian op 23/07/2022 16:11:11:
ik zie ,
deze tekst : IJ bent de programmeur, dus JIJ moet je afvragen waarom je ergens een link plaatst. Je moet niet zomaar ergens code kopiëren en plakken. Je moet weten WAAROM je iets doet.
deze tekst : IJ bent de programmeur, dus JIJ moet je afvragen waarom je ergens een link plaatst. Je moet niet zomaar ergens code kopiëren en plakken. Je moet weten WAAROM je iets doet.
Haha, precies de allerlaatste zin waar het over ging ontbreekt. Het ging niet om het bovengenoemde stukje. Het gaat om die allerlaatste zin:
"Als ik jou was, dan zou ik werken met jQuery. Dat maakt het werken met JavaScript een stuk makkelijker."
Jij schrijft hierboven:
"het lijkt dat jquery is makkelijker dan javascript"
En dat had ik je dus een maand geleden al gezegd dat dat makkelijker is. Als je jQuery gaat gebruiken kun je waarschijnlijk veel makkelijker alle dingen doen die jij wilt doen.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<?php
define('POSTED', 'POST' === $_SERVER['REQUEST_METHOD']);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PHPHulp</title>
<style>
html,body { font: 14px Verdana; }
label { cursor: pointer; }
input, button { font-family: inherit; padding: 8px; border-radius: 4px; }
.success {
color: blue;
animation: disappear 1s ease 4s forwards;
}
@keyframes disappear {
from: {
opacity: 1;
font-size: 14px;
line-height: 14px;
}
to {
opacity: 0;
font-size: 0;
line-height: 0;
}
}
</style>
</head>
<body>
<?php if (POSTED): ?>
<p class="success">Dankuwel. Het formulier is succesvol verzonden</p>
<?php endif;?>
<form id="contact" method="post" accept-charset="utf-8">
<label>
Naam:
<input type="text" name="name">
</label>
<label>
E-mail:
<input type="text" name="email">
</label>
<input type="submit" value="submit me">
</form>
</body>
</html>
define('POSTED', 'POST' === $_SERVER['REQUEST_METHOD']);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PHPHulp</title>
<style>
html,body { font: 14px Verdana; }
label { cursor: pointer; }
input, button { font-family: inherit; padding: 8px; border-radius: 4px; }
.success {
color: blue;
animation: disappear 1s ease 4s forwards;
}
@keyframes disappear {
from: {
opacity: 1;
font-size: 14px;
line-height: 14px;
}
to {
opacity: 0;
font-size: 0;
line-height: 0;
}
}
</style>
</head>
<body>
<?php if (POSTED): ?>
<p class="success">Dankuwel. Het formulier is succesvol verzonden</p>
<?php endif;?>
<form id="contact" method="post" accept-charset="utf-8">
<label>
Naam:
<input type="text" name="name">
</label>
<label>
E-mail:
<input type="text" name="email">
</label>
<input type="submit" value="submit me">
</form>
</body>
</html>
Toevoeging op 23/07/2022 20:38:02:
dank u wel Jan ,
hartelijke bedankt ik ga u advies morgen proberen voor inzicht.
de probleem is opgelost ik heb de jquery code gevonden.
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<script>
$(document).ready(function () {
setTimeout(function () {
$('#success').hide();
}, 10000);
});
</script>
$(document).ready(function () {
setTimeout(function () {
$('#success').hide();
}, 10000);
});
</script>
plus deze code toegevoegd in php:
als u gaat naar mij url dan kunt u zien hoe het werkt :https://webdesignleren.com/contact/
ik heb geen enkele bedoeling met mij website url toevoegen ik wil alleen laten zien dat ik lieg niet.
uiteindelijk deze website van mij zegt niets . het is alleen code test website.
hartelijk bedankt iedereen voor jullie advies en hulp
Gewijzigd op 25/07/2022 14:04:12 door - Ariën -
Flink doortypen dus.
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<script>
$(document).ready(function () {
setTimeout(function () {
$('#submit').hide();
}, 10000);
});
</script>
$(document).ready(function () {
setTimeout(function () {
$('#submit').hide();
}, 10000);
});
</script>