JS Muusika ankeedi loomine
1. Konspekt JavaScript
Funktsioon valiMuusika() töötab nii, et on olemas nimekiri (input checkbox-idest), kus kasutaja saab valida soovitud bände või artiste ja märkida need. Valikute all kuvatakse rida, kus on kirjas, millised bändid või artistid kasutaja valis.
function valikMuusika() {
let v1=document.getElementById("vastus1");
let fm =document.getElementById("FleetwoodMac");
let tw=document.getElementById("TheWeeknd");
let am=document.getElementById("ArcticMonkeys");
let k=document.getElementById("KISS");
let im=document.getElementById("ImagineDragons");
let valik="";
if (fm.checked) {valik+=fm.value + ", "; }
if (tw.checked) {valik+=tw.value + ", ";}
if (am.checked) {valik+=am.value + ", ";}
if (k.checked) {valik+=k.value + ", ";}
if (im.checked) {valik+=im.value + ", ";}
v1.innerHTML="<strong>Sa valisid:</strong> " + valik;
}

Funktsioon arvamus() töötab nii, et kui sa kirjutad teksti tekstiväljale (textarea), siis sinu sisestatud tekst kuvatakse allpool tekstivälja.
function arvamus() {
let v2=document.getElementById("vastus2");
let text=document.getElementById("vas")
v2.innerHTML="<strong>Sa arvamus: </strong>" + text.value;
}

Funktsioon tundiKuulad() töötab nii, et kui kasutaja kirjutab, mitu tundi ta muusikat kuulab (number-sisendväljal), siis selle all kuvatakse, mitu tundi päevas ta muusikat kuulab.
function tundiKuulad(){
let v3=document.getElementById("vastus3");
let num=document.getElementById("num");
v3.innerHTML="Sa kuulad muusikat " +"<strong>"+num.value+"</strong>" + " tundi pأ¤evas";
}

Funktsioon kuuladRaadiot() töötab nii, et kasutaja valib raadionuppudest (input radio) “jah” või “ei”, ning allpool kuvatakse, kas kasutaja kuulab raadiot või mitte.
function kuuladRaadiot(){
let v4=document.getElementById("vastus4");
let jah=document.getElementById("jah");
let ei =document.getElementById("ei");
if (jah.checked) {v4.innerHTML="<strong>Raadio kuulamine:</strong> " + jah.value;}
if (ei.checked) {v4.innerHTML="<strong>Raadio kuulamine: </strong>" + ei.value;}
}


Funktsioon raadiojaamu() töötab nii, et kasutaja kirjutab raadiojaamad tekstiväljale (input text), ning allpool kuvatakse tekst “Sinu raadiojaamad:” ja kasutaja vastus.
function raadiojaamu(){
let v5=document.getElementById("vastus5");
let raadio=document.getElementById("raadio");
v5.innerHTML="<strong>Sinu nimetatud jaamad: </strong>" + raadio.value;
}

Funktsioon stiil() töötab nii, et kasutaja valib rippmenüüst (select) mingi stiili ning allpool kuvatakse tema vastus ja valitud stiil. Kui midagi pole valitud, siis kuvatakse teade, et tuleb stiil valida.
function stiil(){
let v6=document.getElementById("vastus6");
let still=document.getElementById("still");
if(still.selectedIndex !== 0){
v6.innerHTML="<strong>Sinu vastus: </strong>" + still.value;
}
else{
v6.innerHTML="<i>Tee ripploendi lahti ja vali!</i> ";
}
}

Funktsioon saada() on seotud nupuga (input button) “Saada”, mis saadab kõik sinu vastused vormi nimega vastused.
function saada(){
let vastused=document.getElementById("vastused");
let v1=document.getElementById("vastus1").innerHTML;
let v2=document.getElementById("vastus2").innerHTML;
let v3=document.getElementById("vastus3").innerHTML;
let v4=document.getElementById("vastus4").innerHTML;
let v5=document.getElementById("vastus5").innerHTML;
let v6=document.getElementById("vastus6").innerHTML;
vastused.innerHTML= v1+"<br>"+v2+"<br>"+v3+"<br>"+v4+"<br>"+v5+"<br>"+v6;
}

Funktsioon puhasta() on seotud nupuga (input button) “Puhasta”, ja see töötab nii, et kui sa sellel klikid, siis kõik sinu valitud ja saadetud vastused kustutatakse.
function puhasta(){
let v1= document.getElementById("vastus1");
let fm =document.getElementById("FleetwoodMac");
let tw=document.getElementById("TheWeeknd");
let am=document.getElementById("ArcticMonkeys");
let k=document.getElementById("KISS");
let im=document.getElementById("ImagineDragons");
v1.innerHTML="";
fm.checked=false;
tw.checked=false;
am.checked=false;
k.checked=false;
im.checked=false;
let v2= document.getElementById("vastus2");
let text=document.getElementById("vas");
v2.innerHTML="";
text.value="";
let v3= document.getElementById("vastus3");
let num=document.getElementById("num");
v3.innerHTML="";
num.value="";
let v4= document.getElementById("vastus4");
let jah=document.getElementById("jah");
let ei =document.getElementById("ei");
v4.innerHTML="";
jah.checked=false;
ei.checked=false;
let v5= document.getElementById("vastus5");
let raadio=document.getElementById("raadio");
v5.innerHTML="";
raadio.value="";
let v6= document.getElementById("vastus6");
let still=document.getElementById("still");
v6.innerHTML="";
still.value="";
let vastused=document.getElementById("vastused");
vastused.innerHTML="";
}





