Μέθοδος val
Η μέθοδος val επιτρέπει τη λήψη και την αλλαγή
της τρέχουσας τιμής ενός στοιχείου.
Σύνταξη
Έτσι μπορούμε να λάβουμε την τρέχουσα τιμή του πρώτου στοιχείου στο σύνολο:
$(selector).val();
Η μέθοδος val χρησιμοποιείται κυρίως για τη
λήψη τιμών από στοιχεία φόρμας, όπως:
input,
select
και textarea. Αν
καλείται σε ένα κενό σύνολο, θα επιστρέψει undefined.
Όταν εργάζεστε με select που έχει οριστεί το attribute
multiple, η μέθοδος θα επιστρέψει έναν πίνακα με τις τιμές κάθε
επιλεγμένου option. Αν κανένα από αυτά δεν είναι επιλεγμένο,
θα επιστραφεί ένας κενός πίνακας. Έτσι μπορούμε να ορίσουμε
την τιμή κάθε στοιχείου στο σύνολο. Ως παράμετρο μπορούμε
να μεταβιβάσουμε string, πίνακα ή αριθμό:
$(selector).val(value);
Εφαρμογή μιας συνάρτησης σε κάθε στοιχείο του συνόλου. Η συνάρτηση δέχεται ως πρώτη παράμετρο τον τρέχοντα αριθμό στο σύνολο, και ως δεύτερη - την τρέχουσα τιμή του:
$(selector).val(attribute name, function(index, currentValue));
Παράδειγμα
Στο επόμενο παράδειγμα ας λάβουμε τις τιμές που εισάγονται στο input, και ας τις εμφανίσουμε παρακάτω σε μια παράγραφο:
<input type="text" value="text">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Παράδειγμα
Και τώρα με τη μέθοδο val θα
καταγράφουμε τις τιμές των κουμπιών που θα
πατάμε, στο input που βρίσκεται παρακάτω:
<div>
<button>one</button>
<button>two</button>
<button>three</button>
<button>four</button>
</div>
<input type="text" value="click buttons">
button {
margin: 4px;
cursor: pointer;
}
input {
margin: 4px;
color: green;
}
$('button').click(function() {
let text = $(this).text();
$('input').val(text);
});
