setTimeout函数,单击文档

时间:2017-10-20 08:11:43

标签: javascript jquery

我的代码有问题。当我点击获得某个类的div时,我想要这样做,并在1秒后删除该类。以下是我的代码示例:

$(document).ready(function() {
  alert('aaa');
  $(document).on("click", ".items-layout > div", function() {
    var $this = $(this);
    $this.addClass('hover-effect');
    $this.off("click");
  }, function() {
    setTimeout(function() {
      var $self = $(this);
      $self.removeClass('hover-effect');
      alert('yolo');
    }, 1000);
});

2 个答案:

答案 0 :(得分:3)

.on('click'

出了什么问题:

你传递了stadium两个函数。但是你只能传递一个(第二个被忽略)。因此,您需要将代码从第二个移动到第一个。这就是我做的事情

答案 1 :(得分:0)

试试这个......

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            .hover-effect{
                background-color: #00733e;
            }
            .normal-effect{
                color: #000000;
                background-color: #ffffff;
            }
        </style>
    </head>
    <body>
        <div class="items-layout">
            <div>sample</div>
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script>
            $(document).ready(function () {
                alert('aaa');
                $(document).on("click", ".items-layout > div", function () {
                    var $this = $(this);
                    console.log($this);
                    $this.addClass('hover-effect');
                    $this.off("click");
                    setTimeout(function () {
                        var $self = $(this);
                        $self.removeClass('hover-effect');
                        $this.addClass('normal-effect');
                        alert('yolo');
                    }, 1000);
                });
            });
        </script>
    </body>
</html>

谢谢...