Динамически добавленный переключатель не обновляется при нажатии в IE6, IE7 - PullRequest
3 голосов
/ 13 декабря 2010

Я добавил группу переключателей динамически в DOM, используя jQuery. Я зарегистрировал обработчики событий, которые работают хорошо. Однако при щелчке в IE6 и IE7 группа переключателей не обновляется, с помощью которой проверяется кнопка.

Мой оригинальный код аналогичен этому:

<body>
<form action="radio-ie7_submit" method="get" accept-charset="utf-8"></form>
<script type="text/javascript" charset="utf-8">
    $(function() {
        $.each(['A','B', 'C'], function (i, e) {
            $('<input>')
                .attr('type', 'radio')
                .attr('name', 'foo')
                .attr('checked', i == 1 ? 'checked' : '')
                .val(e)
                .appendTo($('form'))
                .after(e + '<br />')
                .click(function(){
                    alert('Kliiik')
                })
        })  
    })
</script>
</body>

Опять же, когда я нажимаю переключатель, обработчик события вызывается правильно, но переключатели не обновляются. Я сделал этот хак, который, кажется, работает:

<body>
<form action="radio-ie7_submit" method="get" accept-charset="utf-8"></form>
<script type="text/javascript" charset="utf-8">
    $(function() {
        $.each(['A','B', 'C'], function (i, e) {
            $('<input>')
                .attr('type', 'radio')
                .attr('name', 'foo')
                .attr('checked', i == 1 ? 'checked' : '')
                .val(e)
                .appendTo($('form'))
                .after(e + '<br />')
                .click(function(){
                    $('input[name="' + this.name + '"]').each(function () { this.checked = false });
                    this.checked = true;
                    alert('Kliiik')
                })
        })  
    })
</script>
</body>

По сути, мое исправление состоит в том, чтобы снять все кнопки в группе переключателей, а затем отметить, что кнопка нажата как отмеченная. Кажется, это немного хакерски. Есть ли лучший способ справиться с этим? Кто-нибудь сталкивался с этой проблемой и может дать некоторое представление о том, почему это ведет себя так, как оно происходит?

Спасибо.

1 Ответ

3 голосов
/ 13 декабря 2010

Это старая проблема IE с элементами формы. Здесь виноват не Jquery. Если вам нужен обходной путь для пользователя IE 6, тогда вы можете настроить функцию щелчка следующим образом:

            .click(function(){
                $('input[name="' + this.name + '"]').attr('checked',''); 
                this.checked = true; 
                alert('Kliiik')                
            })
...