Rozdíly

Zde můžete vidět rozdíly mezi vybranou verzí a aktuální verzí dané stránky.

--- krouzek:uloha:zviratka [2020/11/18 16:34] – vytvořeno admin
+++ krouzek:uloha:zviratka [2023/11/15 20:54] (aktuální) – upraveno mimo DokuWiki 127.0.0.1
@@ Řádek 3: / Řádek 3: @@
 ) Postavte zadanému zvířátku správný výběh s dodržením pravidel:
- * Bezpečnost návštěvníků: Zvířátko těžší než 50kg musí mít vysoký plot (1m). Pokud je masožravé, tak 2m. Pokud umí skákat, tak 2,5m
- * Zvířátko které utíká musí mít adekvátní -
+   * Bezpečnost návštěvníků: Zvířátko těžší než 50kg musí mít vysoký plot (1m). Pokud je masožravé, tak 2m. Pokud umí skákat, tak 2,5m
+   * Zvířátko které utíká musí mít adekvátní -
@@ Řádek 25: / Řádek 27: @@
     /* <![CDATA[ */
     function pridej_zviratko(){
-    var jmeno  = document.getElementById('jmeno').value
+    var jmeno = document.getElementById('jmeno').value
-    var utika  = (document.getElementById('utika').value == "ano")
+    var utika = (document.getElementById('utika1').checked)
-    var hmotnost  = parseFloat(document.getElementById('utika').value)
+    var hmotnost = parseFloat(document.getElementById('hmotnost').value)
     // Zde bude vas program
@@ Řádek 51: / Řádek 53: @@
  <form action="#" onsubmit="return false">
  <p><label for="jmeno">Druh zvířátka</label><input name="jmeno" id="jmeno"></p>
- <p><label for="utika">Utíká - ano</label><input type="radio" name="utika" id="utika" value="ano"></p>
+ <p><label for="utika">Utíká - ano</label><input type="radio" name="utika" id="utika1" value="ano"></p>
- <p><label for="utika">Utíká - ne</label><input type="radio" name="utika" id="utika" value="ne"></p>
+ <p><label for="utika">Utíká - ne</label><input type="radio" name="utika" id="utika2" value="ne"></p>
  <p><label for="hmotnost">hmotnost zvířátka</label><input name="hmotnost" id="hmotnost"></p>
+ <input type="submit" onclick="pridej_zviratko()">
+ </form>
+ </div>
+ <div id="zoo">
+ </div>
+</body>
+</html>
+</code>
+=== Vylepšení ===
+<code html>
+<!DOCTYPE html>
+<html lang="cs">
+<head>
+    <meta charset="utf-8" />
+    <title>Titulek</title>
+    <style>
+    /* Vychozi CSS stylovani prijde sem*/
+    /* */
+    </style>
+    <script>
+    /* <![CDATA[ */
+    function pridej_zviratko(){
+    var jmeno  = document.getElementById('jmeno').value
+    var utika  = (document.getElementById('utika1').checked)
+    var hmotnost  = parseFloat(document.getElementById('hmotnost').value)
+    // Zde bude vas program
+    var vyska_plotu = 1
+    if ( hmotnost >= 50 ){
+     vyska_plotu = 2
+    }
+    if ( hmotnost >= 50 && utika ){
+     vyska_plotu = 3
+    }
+    // Prida zviratko do zoo
+    if(jmeno == "velryba"){
+    	postav_vybeh(jmeno, vyska_plotu, "voda")
+    }else{
+    	postav_vybeh(jmeno, vyska_plotu, "trava")
+    }
+    }
+    function postav_vybeh(jmeno, vyska_plotu, typ_povrchu){
+    	if (typ_povrchu == "voda") {
+    		document.getElementById('zoo').innerHTML += "🌊"
+    	}
+    	if (typ_povrchu == "trava") {
+    		document.getElementById('zoo').innerHTML += "🌿"
+    	}
+    	document.getElementById('zoo').innerHTML += jmeno + " - "+ vyska_plotu + "m" + "<br>"
+    }
+    /* ]]> */
+    </script>
+</head>
+<body>
+ <div>
+ <form action="#" onsubmit="return false">
+ <p><label for="jmeno">Druh zvířátka</label><input name="jmeno" id="jmeno"></p>
+ <p><label for="utika">Utíká - ano</label><input type="radio" name="utika" id="utika1" value="ano"></p>
+ <p><label for="utika">Utíká - ne</label><input type="radio" name="utika" id="utika2" value="ne"></p>
+ <p><label for="leta">Letá - ano</label><input type="radio" name="leta" id="leta1" value="ano"></p>
+ <p><label for="leta">Letá - ne</label><input type="radio" name="leta" id="leta2" value="ne"></p>
+ <p><label for="hmotnost">hmotnost zvířátka</label><input type="number" name="hmotnost" id="hmotnost"></p>
  <input type="submit" onclick="pridej_zviratko()">
  </form>