javascript - 使用 jquery 更改链接样式和属性

Question

目前希望采用OOP 风格的javascript 方法，因为我是一名初级程序员，希望提高我的javascript 技能缺口。我的代码似乎根本不起作用，现在我已经尝试了几个小时的不同解决方案。

我的目标 我想完成在页面上创建点击功能的操作。用户点击链接并将 CSS 类 .active 添加到链接(当然，点击时不会将类添加到其他链接)。最后，当用户点击时相同的链接(与类的事件链接)再次用于类删除自身并返回其正常状态。

谢谢你的帮助!

Javascript

var activeState = $(".category-tree-with-article .article-list > li > a, .content-left-bottom li a, .content-right-bottom li a");


          function clickState () {
              this.initEvent();

                 clickState.prototype = {
                     initEvent: function() {

                activeState.on('click', function (event) {
                    event.preventDefault();
                    var el = $(this);

                    // For class changes
                    activeState.toggleClass('active');
                    el.addClass('active');


                    });
                }

            }//prototype inherit
          } //end function

          clickState();

CSS

a.active {
color:red;
font-family:"Prime";
}

Answer 1

我想说你应该停止使用你的“OOP”风格编码

var activeState = $(".category-tree-with-article .article-list > li > a, .content-left-bottom li a, .content-right-bottom li a");

activeState.on('click', function (event) {
    event.preventDefault();

    activeState.not(this).removeClass('active');
    $(this).toggleClass('active');
});