Files
JavaScript-from-Beginner-to…/Chapter 10/Code Samples/ch10-onchang-onblur.html
T
2021-11-25 14:40:42 +01:00

30 lines
859 B
HTML
Executable File

<html>
<body>
<div id="welcome">Hi there!</div>
<form>
<input type="text" name="firstname" placeholder="First name" onchange="logEvent()" />
<input type="text" name="lastname" placeholder="Last name" onblur="logEvent()" />
<input type="button" onclick="sendInfo()" value="Submit" />
</form>
<script>
function logEvent() {
let p = event.target;
if (p.name == "firstname") {
message("First Name Changed to " + p.value);
} else {
message("Last Name Changed to " + p.value);
}
}
function sendInfo() {
let p = event.target.parentElement;
message("Welcome " + p.firstname.value + " " + p.lastname.value);
}
function message(m) {
document.getElementById("welcome").innerHTML = m;
}
</script>
</body>
</html>