jQuery双选项卡替换悬停在链接上

我对触摸设备使用以下代码。 我的页面有几个div作为链接。 第一次点击基本上充当“悬停”，启用类（.active）。 第二次点击用作单击，url取自数据url属性

$(".story").on({'touchstart':
    function(){
        $(".active").removeClass("active"); //Deactivate "active" elements
        $(this).stop(true,true).addClass("active",300).children(".blurb").delay(300).fadeIn(350,function(){
            $(this).click(function(){var url = $(this).data("url"); window.location.href = url;})
        });
    }
});

我的问题是，如果用户点击一次元素（比如说#story1），然后点击另一个元素（#story2），然后返回并点击#story1，它会启动链接，而不是.active类

我假设如果用户离开当前元素，我需要停止该回调函数的触发。谁能帮我解释一下吗

---

谢谢

fadeIn函数将拥有此元素，因此您需要在fadeIn函数中声明它

$(".story").on({'touchstart':
    function(){
     var _this = $(this);
        $(".active").removeClass("active"); //Deactivate "active" elements
        $(this).stop(true,true).addClass("active",300).children(".blurb").delay(300).fadeIn(350,function(){
           _this.click(function(){

               var url = _this.data("url"); 
               window.location.href = url;
});
        });
    }
});

---

也许不是最好的解决办法，但这是我提出的解决办法

$(".story").on({"touchstart":
    function(){
        var clicked = $(this).data("clicked");
        if (clicked == "0"){
            $(".story").data("clicked","0");
            $(this).data("clicked","1");
            $(".active").removeClass("active");
            $(this).stop(true,true).addClass("active",300).children(".blurb").delay(300).fadeIn(350);                       
        }
        else {
            var url = $(this).data("url");
            window.location.href = url;}
        }
});

关于$（this）元素的观点很好，但是您的解决方案仍然会产生相同的问题。第二次点击激活链接，无论元素是否为“.active”。