getElementById su piu id(Risolto)

BlackPr

Nuovo Utente
24 Apr 2020
4
0
1
Salve a tutti, sono neofita sul javascript.
Vi pongo una domanda che sicuramente per vosi sarà banale, ma per me non trovo soluzione.
Questo codice è un esempio di quello che voglio fare:

JavaScript:
<input type="checkbox" id="demo" onclick="myFunction()" value="A">
<input type="checkbox" id="demo" onclick="myFunction()" value="B">
<p id="s">Valore</p>

<script>
function myFunction() {
  var x = document.getElementById("demo").value;
  document.getElementById("s").innerHTML = x;
}
</script>
Praticamente se io clicco nel primo "checkbox" mi restituisce "A" e ok, se clicco sul secondo mi da sempre "A". Come faccio a restituire "B"?
 

Tommy03

Utente Attivo
6 Giu 2018
511
50
28
17
Bassano del Grappa (VI)
Ciao, devi dare id diversi ai due campi e con la stessa class. E Poi devi utilizzare getElementByClassName al posto di getElementById.
In alternativa puoi passare un parametro nella funzione, ad esempio myFunction('A')
 

BlackPr

Nuovo Utente
24 Apr 2020
4
0
1
Ho provato con getElementByClassName ma non funziona e dalla Console del Browser mi dice

Uncaught TypeError: document.getElementByClassName is not a function
at myFunction (prova.html:23)
at HTMLInputElement.onclick (prova.html:18)

JavaScript:
<input type="checkbox" name="prova" id="demo1" onclick="myFunction()" value="A">
<input type="checkbox" name="prova" id="demo2" onclick="myFunction()" value="B">
<input type="checkbox" name="prova" id="demo3" onclick="myFunction()" value="C">
<p id="s">Valore</p>

<script>
function myFunction() {
 var x = document.getElementByClassName("prova").value
     document.getElementById("s").innerHTML = x;
}

</script>
 

Tommy03

Utente Attivo
6 Giu 2018
511
50
28
17
Bassano del Grappa (VI)
Scusa avevo sbagliato a scrivere la funzione si chiama getElementsByClassName.
Nel tuo caso comunque credo sia più semplice così:
HTML:
<input type="checkbox" name="prova" id="demo1" onclick="myFunction('A')" value="A">
<input type="checkbox" name="prova" id="demo2" onclick="myFunction('B')" value="B">
<input type="checkbox" name="prova" id="demo3" onclick="myFunction('C')" value="C">
<p id="s">Valore</p>

<script>
function myFunction(lettera) {
  document.getElementById("s").innerHTML = lettera;
}

</script>
 

BlackPr

Nuovo Utente
24 Apr 2020
4
0
1
Scusa avevo sbagliato a scrivere la funzione si chiama getElementsByClassName.
Si poi mi sono accorto, ma poi mi restituisce "undefined".


HTML:
<input type="checkbox" name="prova" id="demo1" onclick="myFunction('A')" value="A">
<input type="checkbox" name="prova" id="demo2" onclick="myFunction('B')" value="B">
<input type="checkbox" name="prova" id="demo3" onclick="myFunction('C')" value="C">
<p id="s">Valore</p>

<script>
function myFunction(lettera) {
document.getElementById("s").innerHTML = lettera;
}

</script>
Così funziona, grazie ;)
Ma ora però, solo per curiosità, mi sai dire perchè con getElementsByClassName mi resituisce "undefined"?
 

Tommy03

Utente Attivo
6 Giu 2018
511
50
28
17
Bassano del Grappa (VI)
Credo perché con getElementsByClassName bisogna aggiungere dopo l'elemento a cui è riferito (nel tuo caso "prova") la scrittura [0] (0 indica il primo elemento della pagina con quella classe, 1 il secondo, ecc.)
Ad esempio:
HTML:
getElementsByClassName("prova")[0]
Però usando Jquery in realtà non ne sono sicuro perché non l'ho mai utilizzato
 
  • Like
Reactions: BlackPr

mihirmane

Nuovo Utente
24 Apr 2020
1
0
1
Find and hire best top models, singers, influencers with good followers and celebrities managers for work. Hire freelance models, freelance singers, freelance male or female actress in India.
acting auditions