Question

所以我有一个非常简单的按钮，基本上可以打开和关闭一个表单 - 我们将在我们的网站上使用它，因为我们正在进行更新，并希望在任何页面上提供反馈。这是我到目前为止的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。 - 我知道代码可以进一步优化，我只是希望首先使用这些功能 - 然后我回过头来压缩我能做的事情。

Answer 1

您可以使用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
    }
);

Answer 2

这个怎么样：

DateTime*int*decimal*decimal

使用jQuery延迟更改innerHTML文本

2 个答案: