Miért nem működik (JS)?
A kód:
<!DOCTYPE html><html><head><title></title>
<style>
body{margin:0 450px 0 450px;}
h1 {text-align: center;}
.button {
background-color: orange;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 20px 28px;
cursor: pointer;}
.button:hover {
background-color: #e69500;
}
#tova{visibility: hidden;}
</style>
</head>
<body>
<h1>Mi a....?</h1><br><br>
<p id="para"></p>
<button id="p2" class="button" onclick="win()">Buttongrggjo</button>
<button class="button lose" onclick="vill()">Buttongrgrgg</button>
<button class="button lose" onclick="vill()">Buttongrgrgr</button>
<button class="button lose" onclick="vill()">Buttongirossz</button>
<br><br><br><br>
<a id="tova" href="2.html">NEXT QUESTION PLS</a>
<script>
function win(){
if(document.getElementById("p2"))
{
var x = document.getElementById("p2") ;
x.style.backgroundColor= (x.style.backgroundColor=='green'?'orange':'green');
setTimeout('win()', 500);
}
document.getElementById("tova").style.visibility = "visible";
}
function vill()
{
if(document.getElementsByClassName("lose"))
{
var y = document.getElementsByClassName("lose") ;
y.style.backgroundColor= (y.style.backgroundColor=='red'?'orange':'red');
setTimeout('vill()', 500);
}
}
</script>
</body>
</html>
TypeError: y.style is undefined - jelzi hibaként
Probléma: Egy legyen ön is milliomos jellegű játékot szeretnék csinálni. Ennek megfelelően a jó válaszra kattintva zöld, míg rossz válaszra kattintva pirosan kezd villogni az adott gomb. Ez egyenként működött is az első és utolsó válasszal, de mikor meg akartam csinálni, hogy a 3 rossz válasznál is működjön a fent látható hibát produkálta és persze nem is villogott attól fogva. Mi lehet a hiba? Talán a dupla class-ba köt bele a js ami css-html-ben működik? Az y mindenesetre tudtommal definiálva van
válasza: válasza:
válasza:1. Tessék használni kódmegosztó oldalt - az meghagyja az indentálást és használ kódszínezést, így olvashatóbbá téve a kódot.
2. Hiányzik a kezdő <html> tag
3. Hiányzik a kezdő <head> tag
4. A <br> nem sorköz létrehozására jó - helyette ott a CSS margin tulajdonsága.
5. Ha ugyanolyan funkciójú dolgot csinálsz - például egy adott elem villogtatása - akkor annak csinálj egy függvényt.
6. Ha egy osztályt kérdezel le a document.getElementsByClassName segítségével, az egy tömböt ad vissza. Tehát ha az az osztály tagjait el akarod érni, akkor végig kell menned a tömbön.
7. Az onclick attribútum helyett ott van az onclick esemény. Szebb, jobban elkülönül a struktúra és a viselkedés.
Itt látható működés közben:
1. Nyilván nem kifogás, de vmi gebazs volt a pastebinnel (nem engedte a kirakni a linket, merthogy vmi rövidítést nem enged, használjam a teljes linket, vagy mi...fura) jsfiddle-lel meg nem működött vmiért úgy, ahogy kéne (bár nem is használtam még előtte szal nem csoda, ha vmi nem...)
2-3.Nem hiányzik.
4.Tudom, használtam is a margin-t a kódban, de amikor csak gyakorlok nem a szépségre megyek és így volt talán a leggyorsabb.
5-7. Értem, nagyon köszönöm :)
Kapcsolódó kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!