javascript/jquery oop learning

Question

I am very new to OOP. my understanding is that, it is like CSS class, we have classes then we could apply/use it.

this is my code.

$(".mybutton").click(function(){
    $(this).siblings('.mybutton').removeClass('active').end().addClass('active');           
});


$('.mybutton, .second').click(function(event){
    $('#thisDiv').hide().filter(this.hash).show();
    event.preventDefault();
});

$('.second').on("click", function(){
$(".mybutton").eq(1).siblings('.mybutton').removeClass('active').end().addClass('active');
    $("html, body").animate({
        scrollTop: $('#contact').offset().left - 20},
        800);
});

how should I convert them to oop style?

var Doit = {
    init:function(){
        $(".mybutton").on("click", this.active);
    },
    active:function(){
    $(this)
      .siblings('.mybutton')
          .removeClass('active')
              .end().addClass('active');
    },
    filter:function {


    }


};

Doit.init();

if someone could give me a hint, if my code really needs to be changed to OOP ?

Thanks

Check out the jqueryboilerplate.com. That's a way of doing it. — elclanrs
– elclanrs, Commented Jun 5, 2013 at 4:56

Rohan Kumar · Accepted Answer · 2013-06-05 05:03:11Z

1

Try it like,

var Doit = function(){
    this.init=function(){
        $(".mybutton").on("click", this.active);
    },
    this.active=function(){
        $(this)
          .siblings('.mybutton')
              .removeClass('active')
                  .end().addClass('active');
    },
    this.filter=function() {
        //code
    }
};

Collectives™ on Stack Overflow

javascript/jquery oop learning

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related