Výukový program JS

JS HOME Úvod do JS JS Kam vést Výstup JS JS prohlášení Syntaxe JS Komentáře JS JS proměnné JS Let JS Const Operátoři JS JS aritmetika Zadání JS JS datové typy Funkce JS JS objekty Události JS JS struny JS String Methods JS String Search Šablony řetězců JS JS čísla Metody čísel JS JS Arrays Metody JS Array JS Array Sort Iterace pole JS JS Array Const JS Termíny Formáty data JS JS metody získávání data JS metody nastavení data JS Math JS Náhodný JS Booleans JS Srovnání Podmínky JS Přepínač JS JS Loop For JS Loop For In JS Loop For Of Zatímco JS Loop JS Break JS Iterables Sady JS Mapy JS Typ JS Konverze typu JS JS Bitwise JS RegExp Chyby JS Rozsah JS JS Zvedací zařízení Přísný režim JS JS toto klíčové slovo Funkce šipky JS JS třídy JS JSON Ladění JS Průvodce stylem JS JS Best Practices Chyby JS Výkon JS JS Reserved Words

Verze JS

Verze JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Historie JS

JS objekty

Definice objektů Vlastnosti objektu Objektové metody Zobrazení objektu Objektové přístupové objekty Konstruktory objektů Prototypy objektů Iterovatelné objekty Sady objektů Mapy objektů Reference objektu

Funkce JS

Definice funkcí Funkční parametry Vyvolání funkce Volání funkce Funkce Použít Funkční uzávěry

JS třídy

Úvod do třídy Třídní dědičnost Třída Statická

JS Async

JS zpětná volání JS asynchronní JS Sliby JS Async/Await

JS HTML DOM

Úvod do DOM Metody DOM Dokument DOM Prvky DOM DOM HTML Formuláře DOM DOM CSS DOM animace Události DOM DOM Event Listener Navigace DOM DOM uzly Kolekce DOM Seznamy uzlů DOM

Kusovník prohlížeče JS

Okno JS Obrazovka JS Umístění JS Historie JS JS Navigator Popup Alert JS Časování JS Soubory cookie JS

Webová rozhraní API JS

Úvod do webového rozhraní API Web Forms API Webová historie API Web Storage API Web Worker API Web Fetch API Web Geolocation API

JS AJAX

Úvod do AJAXu AJAX XMLHttp Požadavek AJAX Odpověď AJAX Soubor XML AJAX AJAX PHP AJAX ASP Databáze AJAX Aplikace AJAX Příklady AJAX

JS JSON

Úvod do JSON Syntaxe JSON JSON vs XML Datové typy JSON Analýza JSON JSON Stringify Objekty JSON Pole JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Selektory jQuery HTML jQuery jQuery CSS jQuery DOM

Grafika JS

Grafika JS JS Canvas JS Plotly JS Chart.js JS Google Chart JS D3.js

Příklady JS

Příklady JS JS HTML DOM Vstup HTML JS JS HTML objekty JS HTML události Prohlížeč JS Editor JS Cvičení JS JS kvíz Certifikát JS

JS Reference

Objekty JavaScriptu HTML DOM objekty


JavaScript formuláře


Ověření formuláře JavaScript

Ověření formuláře HTML lze provést pomocí JavaScriptu.

Pokud je pole formuláře (fname) prázdné, tato funkce upozorní na zprávu a vrátí hodnotu false, aby se zabránilo odeslání formuláře:

Příklad JavaScriptu

function validateForm() {
  let x = document.forms["myForm"]["fname"].value;
  if (x == "") {
    alert("Name must be filled out");
    return false;
  }
}

Funkci lze volat při odeslání formuláře:

Příklad formuláře HTML

<form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>

JavaScript může ověřit číselný vstup

JavaScript se často používá k ověření číselného vstupu:

Zadejte číslo mezi 1 a 10



Automatické ověření HTML formuláře

Ověření formuláře HTML může prohlížeč provést automaticky:

Pokud je pole formuláře (fname) prázdné, requiredatribut zabrání odeslání tohoto formuláře:

Příklad formuláře HTML

<form action="/action_page.php" method="post">
  <input type="text" name="fname" required>
  <input type="submit" value="Submit">
</form>

Automatické ověření formuláře HTML nefunguje v aplikaci Internet Explorer 9 nebo starší.


Ověření dat

Ověřování dat je proces, který zajišťuje, že vstup uživatele je čistý, správný a užitečný.

Typické úlohy ověřování jsou:

  • vyplnil uživatel všechna povinná pole?
  • zadal uživatel platné datum?
  • zadal uživatel text do číselného pole?

Nejčastěji je účelem ověření dat zajistit správné zadání uživatele.

Validace může být definována mnoha různými metodami a nasazena mnoha různými způsoby.

Ověření na straně serveru provádí webový server po odeslání vstupu na server.

Ověření na straně klienta se provádí webovým prohlížečem před odesláním vstupu na webový server.


Ověření omezení HTML

HTML5 představilo nový koncept ověřování HTML nazvaný ověřování omezení .

Ověření omezení HTML je založeno na:

  • Ověření omezení Vstupní atributy HTML
  • Pseudoselektory CSS pro ověření omezení
  • Ověření omezení Vlastnosti a metody DOM

Ověření omezení HTML vstupní atributy

Attribute Description
disabled Specifies that the input element should be disabled
max Specifies the maximum value of an input element
min Specifies the minimum value of an input element
pattern Specifies the value pattern of an input element
required Specifies that the input field requires an element
type  Specifies the type of an input element

Úplný seznam naleznete v části Vstupní atributy HTML .


Pseudoselektory CSS pro ověření omezení

Selector Description
:disabled Selects input elements with the "disabled" attribute specified
:invalid Selects input elements with invalid values
:optional Selects input elements with no "required" attribute specified
:required Selects input elements with the "required" attribute specified
:valid Selects input elements with valid values

Úplný seznam najdete na CSS Pseudo Classes .