Lee
Lee

Reputation: 137

Increment number within string.

I have a simple image viewer on my page that loads thumbnails underneath. When you click a thumbnail, it just swaps the thumbnail link for the main image by simply removing the thumbnail folder from the url like so:

$('#scroller img').on("click",function(){
$('#main-img').attr('src',$(this).attr('src').replace('t/', ''));
});

But I also want people to be able to click on some left and right arrows to advance or go back one.

Here is my code for the right arrow:

$('#rar').on("click",function(){

 /*$('#main-img').attr('src',$(this).attr('src').replace(/(\d+)/, function(){return arguments[1]*1+1} ));*/

$('#main-img').attr('src',$(this).attr('src').replace(/\d+/, function(val) { return parseInt(val)+1})); 
});

I think the syntax may be wrong. It isn't working anyway. Neither did the failed attempt you can see commented out.

But what I'd really like to do is get the filecount in the image directory and increment the 1 in blah/1.jpg until it reaches the filecount or decrement it until it reaches zero with the left arrow.

My filenames were originally zero padded as 001.jpg, 002.jpg, but i thought that would complicate things even further so I just did away with the padding, unless someone has a simple method with that too.

Simplicity is certainly the key here. I didn't want to have to jump through hoops to simply increase or decrease a damned number.

Any help would be most appreciated as always and thanks for your time in advance ;-)

Upvotes: 1

Views: 182

Answers (1)

brso05
brso05

Reputation: 13222

Try this val should be the second argument in your anonymous function:

$('#main-img').attr('src',$(this).attr('src').replace(/\d+/, function(_, val) { return (parseInt(val)+1);})); 

Upvotes: 1

Related Questions