Question

另一个跨浏览器问题。

JS逻辑：
如果选中一个特定的复选框，则会自动检查相关的复选框反之亦然，如果取消选中此复选框，则取消选中该依赖项：

function changeStatusCheckBox(statusCheckbox) {
    if (statusCheckbox.id == "id1") {
        if (statusCheckbox.checked == true) {
            document.getElementById("id2").checked = true;
            document.getElementById("id3").checked = true;

        } 
        else {
            document.getElementById("id2").checked = false;
            document.getElementById("id3").checked = false;

        }
    }
}

FF没问题 - 立即检查/取消选中。
点击其他浏览器区域后，IE7选中/取消选中看起来IE期望有额外的blur行为。

JS从这个.jsf：

调用

<h:selectBooleanCheckbox id="id1"
value="#{payment.searchByPaymentCriteria}"  onchange="javascript:changeStatusCheckBox(this);"/>

您有什么看法？

感谢您的帮助。

Answer 1

Internet Explorer和其他一些浏览器也是这样的。仅当模糊发生并且更改了某些内容时才会调用onchange事件。文本输入和选择组合也是这样的。

使用复选框（crossbrowser）执行此操作的更好方法是将其绑定到onclick事件。在mouseup事件之后立即调用onclick，因此在调用函数时将更改复选框状态（已选中或未选中）。

就像

一样

<h:selectBooleanCheckbox id="id1" value="#{payment.searchByPaymentCriteria}"  onclick="javascript:changeStatusCheckBox(this);"/>

Answer 2

我喜欢的方法是仅在IE中捕获click事件，并使复选框模糊/聚焦。这将触发IE中的更改事件，您可以继续将更改事件用于支持它的其他浏览器。点击不一样，可能会引入其他问题。（示例使用来自jQuery的$ .browser并假设页面中包含jQuery。）相同的示例适用于单选按钮（替换：radio for：checkbox）。

function fixIEChangeEvent (){
    if ($.browser.msie && $.browser.version < 9) {
        $("input:checkbox").bind("click", function () {
            this.blur();
            this.focus();
        });
    }
}

JS函数不会立即为IE应用复选框值

2 个答案: