Výpis čísla - javascript
Zdarvím,
trošku si začátečnicky hraju s JavaScriptem a narazil jsem problém.
Prosím kde je chyba, po stisknutí tlačítla se hodnota v textovém poli na chvilku změní ale pak jde naspátek na hodnotu "text". Z lišty navigace to píše text=3 a ne text.value=3. Je to tak dobře?. Kde je chyba? Děkuji za ochotu.
<!DOCTYPE HTML>
<html>
<head>
<title>Formular </title>
<script language="JavaScript" type="text/javascript">
function zmena(cislo){
formular.text.value = cislo;
}
</script>
</head>
<body>
<form name = "formular" method="get">
<input type="text" name="text" value = "text"> <br>
<input type="submit" onclick="zmena(3);">
</form>
</body>
</html>
Ja neviem ale je mozne ze po submite sa form reloadne alebo co, skus proste len button a ne submit formu.
<button onclick="myFunction()">Click me</button>
Žádná změna ale ano máš pravdu reloaduje se. Když dám v prohlížeči zpět tak je v textovém poli (dle kodu) čislo 3.
ten button si dal mimo form alebo co zadna zmena? Ked zmacknes obycajny button mimo formu tak sa to nemoze reloadovat.
Hmm, v tom bude ten problém. Formulář vždy odesílá. Dá se tomu nějak zabránit? Nebo jak napsat v JavaS "odkaz" (jak je nyní formular.text.value) na button, který je volně v dokumentu.
Změň:
Frajer !! Submit - odesílá, Button - pouze tlačítko? Je to tak ?
Ano. Ale tento návrh ti psal už MM. v prvním příspěvku.
Pár pripomienok do začiatku:
- Atribút language sa už hodne dlho nepoužíva, namiesto toho slúži na určenie typu atribút type.
- Keďže podľa doctype používaš HTML5, tak typ skriptu ani v atribúte type uvádzať nemusíš. Atribút type je voliteľný a predvolene sa použije jazyk JavaScript.
- K formuláru pristupuješ pomocou premennej formular, ktorá sa automaticky nastavila vďaka tomu, že form má atribút name=formular. Toto ale nie je dobrý prístup, pretože nemusí fungovať všade. Lepšie je pristupovať k formuláru buď cez identifikátor (var form = document.getElementById('formular')), alebo cez kolekciu forms (var form = document.forms.formular).
- Aby si predišiel odoslaniu formulára pri submit tlačidle, stačí keď v obsluhe udalosti vrátiš false (onclick="zmena(3); return false"). To sa využíva hlavne pri validácii formulárov. Ak chceš ale len niečo vykonať a nikdy nechceš odoslať formulár, tak použiješ input type=button, ako ti tu už správne poradili.
- Písať obsluhu udalosti priamo v HTML sa dá prirovnať k použitiu inline štýlov. Keď to celé zapíšeš v JavaScripte, bude to prehľadnejšie a lepšie oddelené. Len musíš pritom myslieť na to, že k prvkom môžeš pristupovať až po tom, ako boli v HTML definované. Takže v tomto prípade by si mal vymazať to onclick=zmena(3) a dať mu nejaké meno, aby si k nemu vedel jednoducho pristupovať v JavaScripte, napr. name=tlacidlo. Potom by si mal element script presunúť pred ukončovací element body. Samotný skript by potom vyzeral nasledovne:
Do premennej form som uložil ten formulár. Použil som document.forms[0], pretože v tomto prípade je na stránke len jeden formulár. Treba ale myslieť na to, že keď pridáš iný formulár pred ten prvý, tak to prestane fungovať. V skutočnosti by bolo lepšie využiť názov alebo identifikátor formulára tak, ako som písal vyššie. Pre takýto príklad je ale použitie document.forms[0] v pohode.
Kľúčové slovo this v obsluhe udalosti obsahuje prvok, na ktorom udalosť nastala, čiže v tomto prípade tlačidlo. Každý formulárový prvok má vlastnosť form, pomocou ktorej sa dá dostať k formuláru. Formulár má zasa vlastnosti podľa elementov, ktoré obsahuje. Takže ak chceme po stlačení priradiť do formulárového elementu name=text hodnotu 3, stačí zavolať this.form.text.value = 3.