checkbox event onclick funktioniert nicht

Question

Ich habe ein Kontrollkästchen und 3 Textfelder, was ich will ist, alle 3 Textfelder zu deaktivieren, wenn das Kontrollkästchen aktiviert ist. Dafür habe ich diesen Code aber nicht funktioniert.

<tr> 
<td><?php echo "Modify Default Package Dimensions:"; ?></td> 
<td><input type="checkbox" name="Modify_Default_Dimensions" value="1" onclick="document.getElementsByClassName('hide_textbox').disabled=this.checked;"></td> 
</tr> 

<td><?php echo "Depth"; ?></td> 
<td><input type="text" class="hide_textbox" name="dhl_product_depth" value="<?php echo $product_depth ?>" /> cm</td> 
</tr> 
<tr> 
<td><?php echo "Width"; ?></td> 
<td><input type="text" class="hide_textbox" name="dhl_product_width" value="<?php echo $product_width ?>" /> cm</td></tr> 
<tr> 
<td><?php echo "Height"; ?></td> 
<td><input type="text" class="hide_textbox" name="dhl_product_height" value="<?php echo $product_height ?>" /> cm</td> 
</tr> 

Answer 1

getElementsByClassName gibt eine Knotenliste (so etwas wie eine Anordnung, aber ohne die Methoden) und man durch die Anordnung in einer Schleife jedes Mitglied mit dieser angegebenen Klasse zu modifizieren.

Zur besseren Lesbarkeit ändern Sie Ihre Checkbox eine Funktion aufzurufen, wenn darauf geklickt:

<input type="checkbox" name="Modify_Default_Dimensions" value="1" onclick="checkboxChecked(this);"></td> 

und definieren Sie die Funktion:

function checkboxChecked(clickedBox) { 
    var hide_textbox = document.getElementsByClassName('hide_textbox'); 
    for(var i = 0; i < hide_textbox.length; i++) { 
     hide_textbox[i].disabled = clickedBox.checked; 
    } 
} 

---

EDIT: Wenn Sie Ihre Textfelder standardmäßig deaktiviert wollen und Überprüfung das Kontrollkästchen aktiviert sie, zuerst hinzufügen, um alle Textfeld beim Laden der Seite zu deaktivieren:

var textboxes = document.getElementsByClassName('hide_textbox'); 
for(var b = 0; b < textboxes.length; b++) { 
    textboxes[b].disabled = true; 
} 

Und dann können Sie Ihre Funktion ändern (beachten Sie, dass ich hide_textbox dieses Mal nicht definieren).

function checkboxChecked(clickedBox) { 
    for(var i = 0; i < textboxes.length; i++) { 
     textboxes[i].disabled = !clickedBox.checked; // if checked, this will enable it 
    } 
}