Document.activeElement not working properly in Chrome, what are the alternatives?

Question

Hello,

I want to check / uncheck all checkboxes with the same class, and also disable / enable related text fields when checking / unchecking the box.

I managed to write code using document.activeElement and document.getElementsByClassName , which will do exactly that, except that it does not work in Chrome. This reported an error in Chrome that returns a body instead of the actual activeElement if activeElement is not a text field.

Is there a workaround that I can use until the error is fixed?

My code is:

JS:

 function changeAll(variable) { var current = document.activeElement; var checkboxes = variable + "_g"; var text = variable + "_v"; var i; if (current.checked === true) { for (i = 0; i < document.getElementsByClassName(checkboxes).length; i++) { document.getElementsByClassName(checkboxes)[i].checked = true; } for (i = 0; i < document.getElementsByClassName(text).length; i++) { document.getElementsByClassName(text)[i].disabled = false; } } else { for (i = 0; i < document.getElementsByClassName(checkboxes).length; i++) { document.getElementsByClassName(checkboxes)[i].checked = false; } for (i = 0; i < document.getElementsByClassName(text).length; i++) { document.getElementsByClassName(text)[i].disabled = true; } } } 

HTML:

 <input type="checkbox" class="y_g" onClick="changeAll('y')"> <input type="text" class="y_v" disabled> <input type="checkbox" class="y_g" onClick="changeAll('y')"> <input type="text" class="y_v" disabled> <br> <input type="checkbox" class="x_g" onClick="changeAll('x')"> <input type="text" class="x_v" disabled> <input type="checkbox" class="x_g" onClick="changeAll('x')"> <input type="text" class="x_v" disabled> 

Answer 1

Go to the link

HTML:

 <input type="checkbox" class="y_g" onClick="changeAll(this,'y')"> 

JavaScript:

 function changeAll(current, variable) { //var current = document.activeElement; 

ideally, you will not use inline events.