I'm looking for a way to write a script that counts from 1 to 10 and after 10 it will repeat, Inside a buttom link.
Example:
<button onclick="window.location.href='/page"1".html'">Submit</button>
First click goes to "url/page1.html"
Second click to "url/page2.html"
Third to "url/page3.html"
Fourth to "url/page4.html"
And up to ten click "url/page10.html"
After the hit number 10, it must run repeat to 1 agin.
Example2:
First click goes to "url/page1.html", click 2 = "url/page2.html", click 3 = "url/page3.html", click 4 = "url/page4.html, click 5 = "url/page5.html, click 5 = "url/page5.html, click 6 = "url/page6.html, click 7 = "url/page7.html, click 8 = "url/page8.html, click 9 = "url/page9.html click 10 = "url/page10.html and now repeat click 11 = "url/page1.html, click 12 = "url/page2.html, click 13 = "url/page3.html, click 14 = "url/page4.html
Hope someone can give me a good example of how this should run, prefer php or javascript.
How about this solution:
<button onclick="myScript(10)">Submit</button>
<script>
let currentPage = 1;
function myScript(totalPages) {
if (currentPage === totalPages) {
currentPage = 1;
return window.location.href=`/page10.html`
}
currentPage = currentPage < totalPages ? currentPage + 1 : 1;
return window.location.href=`/page${currentPage}.html`;
}
</script>
I did not test this, but I believe that even though there could be a mistake, the global reasoning would work for you. The fact that I put the total number of pages as parameter of the function allows you to use this again in other cases.
Can you tell me if it does ?
<body>
<button onclick="window.location.href=getNextPage(document.URL)">Submit</button>
</body>
<script>
function getNextPage(title){
debugger;
var currentPage = parseInt(title.slice(-6,-5));
console.log(currentPage);
var nextPage;
if(currentPage==10){
var nextPage = 0
}
else{
var nextPage = ++currentPage;
}
return "page"+nextPage+".html";
}
</script>
This method parses the URL of your current page and then uses it to increment the number that dictates what will be the next page. I breifly tested this, but let me know if there's anything I can help with.
NOTE: The current page slicing only works if your page URL is in the form page1.html and so on. If any changes should be made to that format, adjust this line accordingly.
You can do it using Window.localStorage
Example:
function goTonextPage() {
if (!localStorage.lastPage) {
localStorage.lastPage = 0;
}
var nextPage = Number(localStorage.lastPage) === 10 ? 1 : Number(localStorage.lastPage) + 1;
localStorage.lastPage = nextPage;
return window.location.href = '/page' + nextPage + '.html';
}<button onclick="goToNextPage();">Submit</button></div>
Create a file paginator.js
Add:
function navigateToNext() {
var regex = /page([\d]+).html/;
var matches = regex.exec(location.pathname);
if (matches[1]) {
localtion.href = "/page"+((matches[1]+1)%10+1)+".html";
}
}
Your button should be:
<button onclick="navigateToNext()">Submit</button>
Don't forget to include the script in all pages it's needed:
<script src='paginator.js'></script>