Lugege, kuidas veebisaidi sisu seada saidi külastajatele

Contenteditable atribuudi kasutamine

Kasutaja poolt redigeeritava teksti loomine on lihtsam kui võite arvata. Sellel eesmärgil pakub atribuut HTML: contenteditable.

Tundmatu atribuut esitati esmakordselt 2014. aastal HTML5-i versiooniga . See määrab, kas veebisaidi külastaja brauseris saab selle valduses olevat sisu muuta.

Contenteditable atribuudi toetus

Enamik kaasaegseid töölaua brauserid toetavad atribuuti.

Need sisaldavad:

Sama kehtib ka enamike mobiilibrauserite kohta.

Kuidas kasutada Contenteditable'it

Lihtsalt lisage atribuut HTML-elemendile, mida soovite muuta. Sellel on kolm võimalikku väärtust: tõsi, vale ja päritud. Inherit on vaikimisi väärtus, mis tähendab, et element võtab oma vanema väärtuse. Samamoodi saab teie värskelt redigeeritava sisu kõiki lapseelemente muuta ka siis, kui te ei muuda nende väärtusi valeks. Näiteks selleks, et muuta DIV-elemendi redigeeritavaks, kasutage:

Loo toimetatavale ülesandele edastatav ülesannete nimekiri

Redigeeritav sisu muudab kõige mõttekamaks, kui selle paariks kohaliku salvestusega, nii et sisu püsib seansside ja saidi külastuste vahel.

  1. Avage oma leht HTML-redaktoris.
  2. Loo märkimata , ebakorrapärase nimekirja nimega myTasks :

    • Mõned ülesanded
    • Teine ülesanne
  1. Lisa
      element:
      Nüüd on toimetatav ülesannete loend, aga kui sulgete oma brauseri või lehte jätate, kaob teie loend. Lahendus: lisage lihtne skript ülesannete salvestamiseks localStorage'ile.
    • Lisage oma dokumendi link jQuery'ile.