Το onchange είναι το Γεγονός κατά το οποίο ο χρήστης αλλάζει τιμή σε ένα πεδίο της Φόρμας και έπειτα απομακρύνεται από αυτό, δηλαδή όταν ο χρήστης πατήσει με το ποντίκι του οπουδήποτε στην σελίδα έξω από το στοιχείο αυτό ή πατήσει το κουμπί Tab. Το onchange λειτουργεί μόνο σε στοιχεία Φόρμας.
Μάθετε περισσότερα για τις Φόρμες
Μάθετε περισσότερα για τις Φόρμες
Παράδειγμα 1
Παρακάτω έχουμε δύο πεδία κειμένου και μια Λίστα Επιλογών μέσα σε μια Φόρμα τα οποία περιέχουν το Γεγονός onchange. Αν αλλάξετε το περιεχόμενο των πεδίων και έπειτα πατήσετε οπουδήποτε αλλού στην σελίδα ή πατήσετε το κουμπί Tab, τότε θα εμφανιστεί ένα κουτί με το μήνυμα: 'Μόλις εκτελέστηκε ένα Γεγονός onchange'.
Δείτε τον κώδικα:
Δείτε τον κώδικα:
Το γεγονός onchange
<html>
<head>
<title>WLearn.gr</title>
<script type="text/javascript">
<!--
function disp_alert()
{
alert("Μόλις εκτελέστηκε ένα Γεγονός onchange")
}
//-->
</script>
<body>
<form>
Όνομα:<input name="pedio1" type="text" size="10" onchange="disp_alert()">
Επώνυμο: <input name="pedio2" type="text" size="10" onchange="disp_alert()">
Ηλικία:
<select name="fylo" onchange="disp_alert()">
<option value="male" selected="selected" >Ανδρας</option>
<option value="female">Γυναίκα</option>
</select>
</form>
</body>
</html>
<head>
<title>WLearn.gr</title>
<script type="text/javascript">
<!--
function disp_alert()
{
alert("Μόλις εκτελέστηκε ένα Γεγονός onchange")
}
//-->
</script>
<body>
<form>
Όνομα:<input name="pedio1" type="text" size="10" onchange="disp_alert()">
Επώνυμο: <input name="pedio2" type="text" size="10" onchange="disp_alert()">
Ηλικία:
<select name="fylo" onchange="disp_alert()">
<option value="male" selected="selected" >Ανδρας</option>
<option value="female">Γυναίκα</option>
</select>
</form>
</body>
</html>