Η χρήση των εικόνων αντί για το ραδιόφωνο και Checkbox

Η ανάγκη να χρησιμοποιήσετε εικόνες αντί για πλαίσια ελέγχου και κουμπιά επιλογής πηγάζει από το γεγονός ότι, μέσω CSS, τα στοιχεία φόρμας είναι δύσκολο σχηματοποιημένα στοιχεία όπως πλαίσια ελέγχου, κουμπιά επιλογής και επιλέξτε το πλαίσιο, δεν μπορεί να γίνει " Ως «επίπεδο μέσω των φύλλων στυλ, οπότε πρέπει να καταφύγει σε κάποια κόλπα για να καλύψουν αυτή την αισθητική ανεπάρκεια.

Εικόνες για τα πλαίσια ελέγχου και κουμπιά επιλογής

Χρησιμοποιώντας το αγαπημένο σας πρόγραμμα γραφικών, να δημιουργήσετε τέσσερις εικόνες, δύο θα εκπροσωπήσει το πλαίσιο ελέγχου δεν αποτιμάται και δεν εκτιμάται ραδιόφωνο, ενώ τα άλλα δύο αποτελούν τα πλαίσια ελέγχου και αποτιμώνται ραδιόφωνο.

Σε ΔΕΝ θα μου ένα γραφικό δημιούργησα με παλιές καλές MS Paint τις παρακάτω εικόνες (και τα ονόματα των αρχείων τους):

	checkbox_pieno.jpg
	checkbox_vuoto.jpg
	radio_pieno.jpg
	radio_vuoto.jpg

Αποθήκευση στο βιβλίο εργασίας μας.

HTML μορφή

Μέσα στο βιβλίο εργασίας, δημιουργήστε ένα αρχείο HTML και corrediamolo τον ακόλουθο κώδικα:

 <form name="modulo">







 ΣΕΞ <p> </ b> </ p>







 <input type="hidden" name="sesso">







 <p>







 <img src="radio_vuoto.jpg" id="sesso_U" onclick="Sesso('U','D')" Man align="absmiddle">







 <img src="radio_vuoto.jpg" id="sesso_D" onclick="Sesso('D','U')" Γυναίκα align="absmiddle">







 </ P>







 <p> HOBBY </ b> </ p>







 <input type="hidden" name="hobby">







 <p>







 <img src="checkbox_vuoto.jpg" id="hobby_C" onclick="Hobby('C')" align="absmiddle"> Cinema







 <img src="checkbox_vuoto.jpg" id="hobby_L" onclick="Hobby('L')" Ανάγνωση align="absmiddle">







 <img src="checkbox_vuoto.jpg" id="hobby_S" onclick="Hobby('S')" align="absmiddle"> Sports







 </ P>







 <input type="button" value=" OK "onclick="Conferma()">







 </ Form>

Ας πάμε κατευθείαν.

Άνοιγμα (και κλείσιμο) τακτικά <form>, εισαγωγή εικόνων από πλαίσια ελέγχου και κουμπιά επιλογής, αντί των παραδοσιακών στοιχείων του εντύπου, τον καθορισμό της αρχικής εικόνες που αντιπροσωπεύουν το πεδίο κενό.

Για κάθε ομάδα, περνάμε μια ταυτότητα με ένα πρόθεμα ίση και αντιπροσωπευτική με το πρόθεμα (για παράδειγμα) την αρχική περιγραφή του δικαιώματος προαίρεσης.

Η εικόνα θα έχει επίσης onclick εκδήλωση, αλλά ανάλογα με το αν πρόκειται για ένα κουμπί ή ένα πλαίσιο ελέγχου, ορίστε δύο ή μία αναφορά λειτουργία παράμετρο.

Στην περίπτωση των πλαισίων ελέγχου, να περάσει μόνο η αξία του δικαιώματος προαίρεσης, αλλά στην περίπτωση της κουμπιά επιλογής, η αξία του το πρώτο πέρασμα και στη συνέχεια η τιμή που δεν θα πρέπει να λάβει.

Με λίγα λόγια, από την ανάλυση των λειτουργιών JavaScript, αυτές είναι σαφείς λόγους.

Τέλος, χρησιμοποιούμε ένα κρυφό πεδίο (hidden τύπου) για να πάτε για να αποθηκεύσετε την τιμή ή τις τιμές που περνούν από μας "εικόνες / πεδία."

Η εμφάνιση του εντύπου θα έχει ως εξής:

Προχωρήστε.

• <<
• 1
• 2
• >>