Анимация jQuery не будет работать на одном элементе

Question

У меня есть следующий код jQuery, который запускается, когда я нажимаю опцию в поле выбора:

$('#name, #account, #kid')
    .attr('disabled', 'disabled')
    .css('background-color', '#ffffcc')
    .animate({ backgroundColor:'#ffffff' }, 1000);

Этот код принимает три поля ввода #name, #account и #kid, отключает их, меняет цвет фона, а затем меняет цвет фона на белый.Я использую плагин jQuery Color, который позволяет мне плавно менять цвета.

Проблема в том, что когда сайт только что загружен, и я меняю выбранную опцию, он отключает все три поля, меняет цвет фона и, но первый элемент #name не будет плавно менять цвет фона на белый.Только два следующих.

Но если я попытаюсь снова изменить параметр поля выбора, он каждый раз будет работать отлично!Таким образом, проблема возникает только в первый раз после перезагрузки страницы.Кто-нибудь еще испытывал то же самое раньше?

Вот jQuery целиком:

$('#receiver').change(function(){

    var selected = $(this).children('option:selected').val();

    if (selected == 'new')
    {
        $('#name, #account, #kid').val('').attr('disabled', '');
    }
    else
    {
        $.getJSON("<?php echo site_url('ajax/get_receivers') ?>",
        function(data){
            $.each(data, function(i, data){
                if (data.id == selected)
                {
                    $('#name').val(data.name);
                    $('#account').val(data.account);
                    $('#kid').val(data.kid);

                    $('#name, #account, #kid')
                        .attr('disabled', 'disabled')
                        .css('background-color', '#ffffcc')
                        .animate({ backgroundColor:'#ffffff' }, 1000);
                }
            });
        });
    }

});

#receiver быть полем выбора.

Answer 1

Оба WFM с запросом ajax/json

http://jsbin.com/egani --> с пользовательским интерфейсом jQuery

http://jsbin.com/ekura/ --> со старым плагином цвета jQuery (2 года+)