Задержка изменения текста innerHTML с помощью jQuery - PullRequest
Новая
       7

Задержка изменения текста innerHTML с помощью jQuery

3 голосов
/ 29 февраля 2012

Итак, у меня есть довольно простая кнопка, которая в основном включает и выключает форму - мы будем использовать ее на нашем сайте, так как мы делаем обновление и хотели бы, чтобы отзывы были доступны на любой странице. Вот jQuery, который у меня есть: 

<script>
// Toggle Button Text Change
$('#feedbackLink').hover(
    // Change HTML on mouseover
    function() {
        $(this).html('Send us a quick message!');
    },
    // Change back on mouseout
    function() {
        $(this).html('How can we improve this page?');
    }
);
// Toggle Button and Form
$('#feedbackLink').click(function() {
    // Hide feedback button
    $('#feedbackLink').toggle(500);
    // Display feedback form
    $('#feedbackForm').delay(501).toggle(250);
});
// Feedback Form
$('#cancel').click(function() {
    // Slides form from view when "CANCEL" is clicked
    $('#feedbackForm').toggle(500);
    // Fades original link back into view after a defined delay to allow for previous form to be hidden
    $('#feedbackLink').delay(501).toggle(75);
});
</script>

Итак, мой вопрос: как я могу отложить или исчезнуть в вызове .hover или в свопе .html?

Спасибо за помощь.

P.S. - Я знаю, что код можно и дальше оптимизировать, мне просто нравится, чтобы сначала работала функциональность, а затем я возвращаюсь назад и сгущаю все, что могу.

Ответы [ 2 ]

4 голосов
/ 29 февраля 2012

Вы можете достичь этого, используя setTimeout(): 

var timeout;
$('#feedbackLink').hover(
    function() {
        clearTimeout(timeout);
        timeout = setTimeout(function() {
            $("#feedbackLink").html('Send us a quick message!');
        }, 2000); // change the HTML after 2 seconds
    },
    function() {
        clearTimeout(timeout);
        timeout = setTimeout(function() {
            $("#feedbackLink").html('How can we improve this page?');
        }, 2000); // change the HTML after 2 seconds
    }
);
0 голосов
/ 10 марта 2016

Как насчет этого: 

   $(document).ready(function() {

      function changeText(){
        $("#myDiv").text('test')
      }

      setTimeout(changeText, 2000);

    });
...