document.activeElement无法在Chrome上正常运行，有哪些替代方案? [英] document.activeElement doesn't work as expected on Chrome, what are the alternatives?

问题描述

我想选中/取消选中具有相同类的所有复选框，并在选中/取消选中复选框时禁用\启用关联的文本字段.

I want to check/uncheck all the checkboxes with the same class as well as disable\enable the associated text fields when checking/unchecking a checkbox.

我设法使用document.activeElement和document.getElementsByClassName编写了一个代码，除了在Chrome上不起作用外，它完全可以做到这一点.这是一个报告的Chrome中的错误，它返回正文而不是实际的activeElement，除非activeElement是文本字段.

I managed to write a code using document.activeElement and document.getElementsByClassName that'll do exactly that, except that it doesn't work on Chrome. It's a reported bug in Chrome that it returns body instead of the actual activeElement unless the activeElement is a text field.

在错误修复之前，有没有可以使用的解决方法?

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

我的代码:

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>

推荐答案

传递参考

HTML:

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

JavaScript:

JavaScript:

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

理想情况下，您不会使用内联事件.

ideally you would not be using inline events.

这篇关于document.activeElement无法在Chrome上正常运行，有哪些替代方案?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！