Naučte se nastavit obsah webových stránek jako upravitelných pro návštěvníky stránek

Použití atributu Contenteditable

Zpracování textu na webu upravitelném uživateli je snadnější, než byste očekávali. HTML poskytuje atribut pro tento účel: kontenteditable.

Atribut kontentedable byl poprvé představen v roce 2014 s vydáním HTML5 . Určuje, zda obsah, který řídí, může změnit návštěvník webu z prohlížeče.

Podpora atributu Contenteditable

Většina moderních desktopových prohlížečů podporuje tento atribut.

Tyto zahrnují:

Totéž platí pro většinu mobilních prohlížečů.

Jak používat Contenteditable

Jednoduše přidáte atribut prvku HTML, který chcete upravovat. Má tři možné hodnoty: pravdivé, falešné a dědí. Funkce dědictví je výchozí hodnota, což znamená, že element přebírá hodnotu jejího nadřazeného objektu. Stejně tak mohou být libovolné podřízené prvky vašeho nově upravitelného obsahu upravitelné, pokud nezměníte jejich hodnoty na hodnotu false. Chcete-li například upravit prvek DIV, použijte:

Vytvoření seznamu upravitelných úloh s kontinentním obsahem

Upravitelný obsah je nejvhodnější, když jej spojíte s místním úložištěm, takže obsah přetrvává mezi relacemi a návštěvami na webu.

  1. Otevřete stránku v editoru HTML.
  2. Vytvoření seznamu s odrážkami s názvem myTasks :

    • Některá úloha
    • Další úloha
  1. Přidejte atribut contenteditable k elementu
      :
      Nyní máte seznam úkolů, který lze upravovat - ale pokud zavřete prohlížeč nebo opustíte stránku, zmizí váš seznam. Řešení: Přidejte jednoduchý skript pro ukládání úkolů do localStorage.
    • Přidejte odkaz do jQuery v dokumentu.