Ändern einer Checkbox checked values (Schleife funktioniert nicht)

-2

Ich versuche, einen JavaScript-Code zu erstellen, der den Wert aus einem Eingabefeld übernimmt und alle anderen Eingaben mit derselben Klasse ändert, wenn das entsprechende Kontrollkästchen aktiviert ist. Das Javascript ist an der Unterseite, aber bekommt immer noch an allen 3 Tasten:Ändern einer Checkbox checked values (Schleife funktioniert nicht)

Uncaught Typeerror: kann Eigenschaft ‚Wert‘ von null auf change_numbr

Ratschläge lesen?

Code:

<form> 
    <fieldset> 
      <label for="check1">Check</label> 
      <input id="check1" type="checkbox" class="chkbox">   
      <label for="number1">Number</label> 
      <input id="number1" type="text" class="numbr" value="324"> 
      <button type="button" onClick="change_numbr('numbr1')">click</button> 
    </fieldset> 
    <fieldset> 
      <label for="check2">Check</label> 
      <input id="check2" type="checkbox" class="chkbox">   
      <label for="number2">Number</label> 
      <input id="number2" type="text" class="numbr" value="85"> 
      <button type="button" onClick="change_numbr('numbr2')">click</button> 
    </fieldset> 
    <fieldset> 
      <label for="check3">Check</label> 
      <input id="check3" type="checkbox" class="chkbox">   
      <label for="number3">Number</label> 
      <input id="number3" type="text" class="numbr" value="3"> 
      <button type="button" onClick="change_numbr('numbr3')">click</button> 
    </fieldset> 
</form>

Code:

<script type="text/javascript"> 
function change_numbr(selected_numbr) { 
    var value_numbr = document.getElementById(selected_numbr).value; 
    var total_numbr = document.getElementsByClassName("numbr"); 
    var i; 
    for (i = 0; i < total_numbr.length; i++) { 
    if (document.getElementById(check[i]).checked) { 
     document.getElementById(number[i]).value = value_numbr; 

     } 
    } 
} 
</script>

Quelle

2017-03-04 Leon Sweeting

Sie Werte an Ihre Funktion wie 'numbr1' vorbei,' numbr2' und 'numbr3', aber keines Ihrer Elemente haben diejenigen, die eine ID. Sie haben jedoch Elemente mit den IDs 'number1',' number2' und 'number3' – j08691

Ich denke, das ist das, was Sie suchen:

function change_numbr(selected_numbr) { 
 

 
    var value_numbr = document.getElementById(selected_numbr).value; 
 
    var total_numbr = document.getElementsByClassName("numbr"); 
 
    var i; 
 
    for (i = 1; i < total_numbr.length; i++) { 
 
    if (document.getElementById("check"+i).checked) { 
 
     document.getElementById("label"+i).innerHTML = value_numbr; 
 

 
     } 
 
    } 
 
}

<form> 
 
    <fieldset> 
 
      <label for="check1">Check</label> 
 
      <input id="check1" type="checkbox" class="chkbox">   
 
      <label id="label1" for="number1">Number</label> 
 
      <input id="number1" type="text" class="numbr" value="324"> 
 
      <button type="button" onClick="change_numbr('number1')">click</button> 
 
    </fieldset> 
 
    <fieldset> 
 
      <label for="check2">Check</label> 
 
      <input id="check2" type="checkbox" class="chkbox">   
 
      <label id="label2" for="number2">Number</label> 
 
      <input id="number2" type="text" class="numbr" value="85"> 
 
      <button type="button" onClick="change_numbr('number2')">click</button> 
 
    </fieldset> 
 
    <fieldset> 
 
      <label for="check3">Check</label> 
 
      <input id="check3" type="checkbox" class="chkbox">   
 
      <label id="label1" for="number3">Number</label> 
 
      <input id="number3" type="text" class="numbr" value="3"> 
 
      <button type="button" onClick="change_numbr('number3')">click</button> 
 
    </fieldset> 
 
</form>

in Zukunft versuchen Variablennamen für einen sauberen einem readeable Code zu klären, fragen, ob Sie irgendwelche Zweifel haben. :)

Quelle

2017-03-04 17:37:36 EnriqueDev

Sie benötigen Zeichenfolge zu verwenden, wird check nicht definiert. so etwas wie:

document.getElementById('check'+i).checked)

gleiche für Nummer lautet:

document.getElementById('number'+i).value

Quelle

2017-03-04 17:12:50

Die IDs numbr1, numbr2 existiert numbr3 nicht im DOM. Ich denke, Sie übergeben die falsche ID an die Funktion change_numbr() in Ihrem Code.

Aber ich denke, das ist nur ein Problem.

Quelle

2017-03-04 17:18:24 pwunderlich

Ich ändere Ihren Code und es funktioniert.

Hier der Code, den ich getestet habe.

<html> 
<head> 
    <title></title> 
    <script type="text/javascript"> 
function change_numbr(selected_numbr) { 
    alert('ciaoooo'); 
    var value_numbr = document.getElementById(selected_numbr).value; 
    console.log(value_numbr); 
    var total_numbr = document.getElementsByClassName("numbr"); 
    console.log(value_numbr.length); 
    var i; 
    for (i = 1; i < total_numbr.length; i++) { 
    if (document.getElementById('check' + i).checked) { 
     document.getElementById('number' + i).value = value_numbr; 

     } 
    } 
} 
</script> 

</head> 
<body> 
    <form> 
    <fieldset> 
      <label for="check1">Check</label> 
      <input id="check1" type="checkbox" class="chkbox">   
      <label for="number1">Number</label> 
      <input id="number1" type="text" class="numbr" value="324"> 
      <button type="button" onClick="change_numbr('number1')">click</button> 
    </fieldset> 
    <fieldset> 
      <label for="check2">Check</label> 
      <input id="check2" type="checkbox" class="chkbox">   
      <label for="number2">Number</label> 
      <input id="number2" type="text" class="numbr" value="85"> 
      <button type="button" onClick="change_numbr('number2')">click</button> 
    </fieldset> 
    <fieldset> 
      <label for="check3">Check</label> 
      <input id="check3" type="checkbox" class="chkbox">   
      <label for="number3">Number</label> 
      <input id="number3" type="text" class="numbr" value="3"> 
      <button type="button" onClick="change_numbr('number3')">click</button> 
    </fieldset> 
</form> 


</body> 
</html>

Schauen Sie den Unterschied mit Ihrem alten Code.

Quelle

2017-03-04 17:31:25

Ich denke, das ist, was Sie brauchen.

function change_numbr(selected_numbr) { 
 
    var value_numbr = document.getElementById(selected_numbr).value; 
 
    var total_numbr = document.getElementsByClassName("numbr"); 
 
    var i; 
 
    for (i = 1; i <= total_numbr.length; i++) { 
 
    if (document.getElementById('check'+i).checked) { 
 
     document.getElementById('number'+i).value = value_numbr; 
 
     } 
 
    } 
 
}

<form> 
 
    <fieldset> 
 
      <label for="check1">Check</label> 
 
      <input id="check1" type="checkbox" class="chkbox">   
 
      <label for="number1">Number</label> 
 
      <input id="number1" type="text" class="numbr" value="324"> 
 
      <button type="button" onclick="change_numbr('number1')">click</button> 
 
    </fieldset> 
 
    <fieldset> 
 
      <label for="check2">Check</label> 
 
      <input id="check2" type="checkbox" class="chkbox">   
 
      <label for="number2">Number</label> 
 
      <input id="number2" type="text" class="numbr" value="85"> 
 
      <button type="button" onclick="change_numbr('number2')">click</button> 
 
    </fieldset> 
 
    <fieldset> 
 
      <label for="check3">Check</label> 
 
      <input id="check3" type="checkbox" class="chkbox">   
 
      <label for="number3">Number</label> 
 
      <input id="number3" type="text" class="numbr" value="3"> 
 
      <button type="button" onclick="change_numbr('number3')">click</button> 
 
    </fieldset> 
 
</form>

Quelle

2017-03-04 17:58:00 Stanly

Ändern einer Checkbox checked values ​​(Schleife funktioniert nicht)

Antwort

Verwandte Themen

Ändern einer Checkbox checked values (Schleife funktioniert nicht)