如何使用jQuery突出显示div几秒钟 [英] how to highlight a div for a few seconds using jQuery

问题描述

我想在页面上添加以下内容:

I want to be add the following to a a page:

单击div时，我要:

1. 将点击的div的背景颜色更改几秒钟
2. 几秒钟后恢复为原始背景颜色

我想通过仅使用jQuery可用功能来实现此目的-即不使用插件或其他任何功能.我对jQuery相对陌生，但我认为可能的解决方案涉及更改所选div的类并使用计时器.

I want to do this by using only jQuery available functions - i.e. not using a plugin or anything else. I am relatively new to jQuery, but I think a possible solution involves the use of changing the class of the selected div and using a timer.

我不确定如何将所有内容放在一起.谁能提供几行代码来说明如何做到这一点?

I am not sure how to put it all together though. Can anyone provide a few lines that show how to do it?

这是我到目前为止所拥有的:

This is what I have so far:

$(function(){
 $('div.highlightable').click(function(){
    //change background color via CSS class
    $(this).addClass('highlighted);
    //set a timer to remove the highlighted class after N seconds .... how?
 });
});

推荐答案

一种方法是使用

One way is to go about like this using setTimeout:

$(function () {
    $('div.highlightable').click(function () {
        $(this).addClass('highlighted');
        setTimeout(function () {
            $('div.highlightable').removeClass('highlighted');
        }, 2000);
    });
});

这篇关于如何使用jQuery突出显示div几秒钟的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！