第二次单击后功能正常工作 [英] Function work after second click

问题描述

Anyboby帮助.为什么函数添加类活动this.parents(".block-parent").find(".periods[data-period="+typelink+"]").addClass('active')在第二次单击后起作用?第一次点击后需要完成！ 链接不正确的示例 http://jsfiddle.net/kngU8/

Anyboby help. Why function add class active this.parents(".block-parent").find(".periods[data-period="+typelink+"]").addClass('active') work after second click? need to be done after first click! link for not right example http://jsfiddle.net/kngU8/

Page.contentSort = function() {
    var $eachblocks = $(".top10_month .periods");
    var $blockhead = $(".block-head__link");
    $blockhead.on("click", function(e){

        var $this = $(this);
        var typelink = $(".block-head__link.active").attr("data-date");
        e.preventDefault();
        $this.parents("ul").find("a").removeClass("active");
        this.className += " active";
        $this.parents(".block-parent").find(".periods").removeClass('active');
        $this.parents(".block-parent").find(".periods[data-period="+typelink+"]").addClass('active');
    });
};

推荐答案

这是因为您正在使用

var typelink = $(".block-head__link.active").attr("data-date")

来找到您刚刚单击的链接，并且您还没有处理更改类的问题，因此它可以使您激活该类的前一个元素有效. 以下内容将返回clicked元素的正确数据日期值，而不是您认为可能是由类名引起的错误数据.

to find the link you've just clicked on, and you haven't dealt with changing the classes yet so it's getting the previous element you gave the class active to. The following will return the correct data-date value of the clicked element, not one you think it might be that's saught by class name.

var typelink = $(this).data("date");
// var typelink = $(this).attr("data-date"); // this isn't how data is used

http://jsfiddle.net/kngU8/7/

这篇关于第二次单击后功能正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！