Использование jQuery для изменения текста кнопки ввода через несколько секунд

Я использую форму и jQuery для быстрого изменения веб-сайта. Я хотел бы изменить текст кнопки на «Сохранено!» затем через несколько секунд измените его на «Обновить», чтобы пользователь мог снова изменить значение. Конечно, они могут поразить "теперь сохранено!" кнопку, но она выглядит не очень хорошо.

$("form.stock").submit(function(){
    // Example Post
    $.post($(this).attr('action'), { id: '123', stock: '1' });
    $(this).find(":submit").attr('value','Saved!');
    // This doesn't work, but is what I would like to do
    setTimeout($(this).find(":submit").attr('value','Update'), 2000);
    return false;
});

Ответы на вопрос(5)

Если это на самом деле «кнопка» затем, чтобы изменить его, вы бы использовали.

$('#button_id').html('New Text');

Конечно, если вы предварительно формируете эту кнопку onClick для этой кнопки, вы можете легко передать (this) в функцию как объект и $ (this) .html ('New Text & apos;); вместо.

Надеюсь, это кому-нибудь поможет.

Решение Вопроса

Первым аргументом для setTimeout является функция. Так что оберните свой код в анонимную функцию, и все готово.

$("form.stock").submit(function(){
    // Example Post
    $.post($(this).attr('action'), { id: '123', stock: '1' });
    var submit = $(this).find(":submit").attr('value','Saved!'); //Creating closure for setTimeout function. 
    setTimeout(function() { $(submit).attr('value','Update') }, 2000);
    return false;
});

Я не могу проверить этот код прямо сейчас. Дайте мне знать, если это не сработает.

EDIT: Как подсказывает redsquare, имеет смысл создать замыкание из самой кнопки отправки.

Я бы предложил, возможно, другой (на мой взгляд, лучший) интерфейс для обратной связи, чем изменение текста кнопки. Вы могли бы использоватьjGrowl илидиалог виджет для отображения сообщения с помощью обратного вызова из метода post.

$("form.stock").submit(function(){
    $.post(
        $(this).attr('action'),
        { id: '123', stock: '1' },
        function() { $.jGrowl("Your update was successfully saved."); }
    );
});
$("form.stock").submit(function(){
    var $form = $(this);
    $.post( $form.attr('action'), { id: '123', stock: '1' } );
    var $submit = $form.find(":submit").attr('value','Saved!');
    window.setTimeout(function() {
         $submit.attr('value','Update') 
    }, 2000);
    return false;
});

Вы, вероятно, хотите обернуть действие в функцию:

setTimeout(function(){$(this).find(":submit").attr('value', 'Update')}, 2000);

Ваш ответ на вопрос