Χρησιμοποιώντας το χαρακτηριστικό Contenteditable
Κάνοντας το κείμενο σε έναν ιστότοπο επεξεργάσιμο από τους χρήστες είναι πιο εύκολο από ό, τι θα περίμενε κανείς. Το HTML παρέχει ένα χαρακτηριστικό για αυτό το σκοπό: contenteditable.
Το χαρακτηριστικό contenteditable εισήχθη για πρώτη φορά το 2014 με την έκδοση του HTML5 . Καθορίζει αν το περιεχόμενο που διέπει μπορεί να αλλάξει από έναν επισκέπτη τοποθεσίας μέσα από το πρόγραμμα περιήγησης.
Υποστήριξη του χαρακτηριστικού Contenteditable
Τα περισσότερα σύγχρονα προγράμματα περιήγησης desktop υποστηρίζουν το χαρακτηριστικό.
Αυτά περιλαμβάνουν:
- Chrome 4.0 και άνω
- Internet Explorer 6 και επάνω
- Firefox 3.5 και πάνω
- Safari 3.1 και πάνω
- Opera 10.1 και πάνω
- Microsoft Edge
Το ίδιο ισχύει και για τα περισσότερα προγράμματα περιήγησης για κινητά.
Πώς να χρησιμοποιήσετε το Contenteditable
Απλά προσθέστε το χαρακτηριστικό στο στοιχείο HTML που θέλετε να επεξεργαστείτε. Έχει τρεις πιθανές αξίες: αλήθεια, ψευδής και κληρονομική. Η κληρονομική είναι η προεπιλεγμένη τιμή, που σημαίνει ότι το στοιχείο παίρνει την τιμή του γονέα του. Ομοίως, οποιαδήποτε παιδικά στοιχεία του πρόσφατα επεξεργάσιμου περιεχομένου σας θα είναι επίσης επεξεργάσιμα, εκτός αν αλλάξετε τις τιμές τους σε false. Για παράδειγμα, για να μπορείτε να επεξεργαστείτε ένα στοιχείο DIV, χρησιμοποιήστε:
Δημιουργία μιας επεξεργάσιμης λίστας υποχρεώσεων με ευελιξία
Το επεξεργάσιμο περιεχόμενο είναι πιο συναρπαστικό όταν το συνδυάζετε με το τοπικό αποθηκευτικό χώρο, συνεπώς το περιεχόμενο συνεχίζεται μεταξύ των περιόδων σύνδεσης και των επισκέψεων ιστότοπων.
- Ανοίξτε τη σελίδα σας σε έναν επεξεργαστή HTML.
- Δημιουργήστε μια λίστα με κουκκίδες με αστερίσκο με το όνομα myTasks :
- Κάποια εργασία li>
- Άλλη εργασία li>
ul>
- Κάποια εργασία li>
- Προσθέστε το χαρακτηριστικό contenteditable στο στοιχείο
- :
- Προσθέστε ένα σύνδεσμο στο jQuery στο του εγγράφου σας.