JQuery Live не стреляет при первом нажатии на флажок

Question

У меня странная проблема.Этот код прекрасно работает в chrome и firefox, но в IE 8 событие live не будет срабатывать при первом снятии флажка.Если я проверю его и затем снова сниму флажок, он будет работать каждый раз после этого.

Мой серверный код в представлении

<%: Html.CheckBox("select-invoice-" + invoice.InvoiceNumber, 
    true, 
    new { title = "choose to not pay anything on this invoice by unchecking this box" }) %>

отображает этот

<input checked="checked" id="select-invoice-TST-1001" 
    name="select-invoice-TST-1001" 
    title="choose to not pay anything on this invoice by unchecking this box" 
    type="checkbox" value="true" />

Мой проводник событий в реальном времени javascript, упрощенный

$(function () {
    $("[id^='select-invoice-']").live('change', function () {
        var invoiceId = $(this).attr('id').substr('select-invoice-'.length);

        ComputeTotalPayment();

        if ($(this).is(':checked')) {
           //save invoice data
        } else {
            //remove invoice data
        }
    });
});

В любом браузере нет ошибок в javascript.Если я переключаю IE в режим совместимости, прямое событие никогда не работает.Другие живые события для кликов по ссылкам работают просто отлично.

Answer 1

Событие изменения не запускается корректно в IE, пока флажок не потеряет фокус.

Ошибка: http://webbugtrack.blogspot.com/2007/11/bug-193-onchange-does-not-fire-properly.html

Вместо этого вам нужно будет сопоставить событие "click".

Answer 2

Я обнаружил, что изменение вызывает некоторые проблемы в IE. Попробуйте вместо этого использовать событие click. Похоже, это решает проблему.

Answer 3

У меня была похожая проблема, и я решил ее, вызвав .change () один раз при загрузке страницы.

$(function () {
$("[id^='select-invoice-']").live('change', function () {
    var invoiceId = $(this).attr('id').substr('select-invoice-'.length);

    ComputeTotalPayment();

    if ($(this).is(':checked')) {
       //save invoice data
    } else {
        //remove invoice data
    }
}).change();
});