Javascript click function inside a loop

Question

im not so good with javascript but i have searched for 5 hours now and no luck.

Im trying to make buttons work, if i write the code one-by-one it works fine and everthing is OK.

I can understand the problem. The click part only works when the CLICK is actualy made. Am i right? but how to i corret so it would work like i need?

Can i send the $(name) value to click function so when my lets say button-1 is clicked then scrollTop: $(button-1-block) or am i over thinking in this case.

    var divHeight = 700
    var blocks = document.getElementsByClassName("blocks");
    var i = 1;

    for(i=1;i<blocks.length+1; i++) {
        var name = "#button-"+i;
        var blx = "#block-"+i;
        $(name).click(function(){
            $('html, body').stop().animate({
                scrollTop: $(blx).offset().top - ( $(window).height() - divHeight )/2 
              }, 2100,'easeInOutExpo');
         });

    }

Well, first of all, you don't need the loop. In jQuery, you use selectors like $('[id^=block-]').click(...) to get all of the elements which start with id="block-#" and end in something else. This you can attach that $.click() to each of the elements in the selected list of elements you found. It's very easy. — Jared Farrish
– Jared Farrish, Commented Sep 30, 2012 at 6:55
try something similar to this code stackoverflow.com/questions/8547845/… — Amitd
– Amitd, Commented Sep 30, 2012 at 6:57

Ram · Accepted Answer · 2012-09-30 07:02:09Z

2

Try this:

var divHeight = 700
//var blocks = $(".blocks");

$('[id^="button"]').click(function(){
     var block = '#block-' + this.id.match(/\d+/g).join("");
     $('html, body').stop().animate({
          scrollTop: $(block).offset().top - ( $(window).height() - divHeight )/2 
     }, 2100,'easeInOutExpo');
});

answered Sep 30, 2012 at 7:02

Ram

145k16 gold badges174 silver badges201 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Javascript click function inside a loop

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related