Взаимодействие IE7 / IE8 с JQuery .removeAttr («отключено»), без применения CSS - PullRequest
Новая
       4

Взаимодействие IE7 / IE8 с JQuery .removeAttr («отключено»), без применения CSS

4 голосов
/ 06 октября 2011

Это скорее любопытство, чем вопрос, но мне интересно, почему следующее не работает.

Скажем, у меня есть HTML-форма с селектором и кнопкой отправки. 

 <form action="/foo/createActivity" method="post" name="activityform" id="activityform" >

<select name="activity" id="activity" >
<option value="1" >Activity 1</option>
<option value="2" >Activity 2</option>
</select>
<input type="submit" class="submit" id="add" value="Add >>"/>
</form>

Тогда у меня есть вызов ajax с определенным jQuery 

$('#activity').change(function() {
    tryDisable($('#activity').val());
});

function tryDisable(activity) {
$.ajax({
    type: 'GET',
    contentType: 'application/json',
    cache: false,
    url: '/foo/checkActivity',
    data: {
        activity: activity
    },
    success: function(disableSubmit) {

        if (disableSubmit == "true") {
            $('#add').attr('disabled', 'true');
        } else {
            $('#add').removeAttr('disabled'); // Problem in IE, doesn't take away CSS of disabled
            // $('#add').css({"text-align" : "center"}); 
            // NO idea why the above fixes the problem, TODO find out
        }
    },
    dataType: 'json'
});
return false;
}

В моих комментариях вы увидите, что только .removeAttr («отключен») вызывает повторное включение кнопки, но кнопка по-прежнему выглядит , как будто она отключена (выделена серым цветом). Однако, если я «щекочу» css с помощью jquery, как я это делал в закомментированной строке, применяется правильный стиль без отключения. Как я и ожидал, Firefox и Chrome отлично работают только с первой строкой.

Кто-нибудь знает, почему это может быть? Что здесь делает странный IE?

1 Ответ

9 голосов
/ 17 октября 2011

У меня раньше была такая же проблема. Я гуглил его и нашел эту заметку на сайте jQuery .

Примечание: Попытка удалить встроенный обработчик событий onclick с помощью .removeAttr() не приведет к желаемому эффекту в Internet Explorer 6, 7 или 8. Чтобы избежать потенциальных проблем, используйте .prop() вместо: 

$element.prop("onclick", null);
console.log("onclick property: ", $element[0].onclick); // --> null

Я также нашел здесь в SO пару сообщений, касающихся .removeAttr():

Этот пост от Джона Ресига также полезен.

...