Функция JS применяет значение флажка не сразу для IE

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. Onclick вызывается сразу после события mouseup, поэтому состояние флажка (отмечено или нет) будет изменено при вызове функции.

Просто нравится

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

Answer 2

Мне нравится это, чтобы ловить событие щелчка только в IE и размыть / сфокусировать флажок.Это вызовет событие изменения в IE, и вы можете продолжать использовать событие изменения для других браузеров, которые его поддерживают.Нажмите не то же самое, и может привести к другим проблемам.(Пример использует $ .browser из jQuery и предполагает, что jQuery включен на странице.) Тот же пример будет работать для переключателей (замените: radio для: флажок).

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