使“下一步”按钮从当前“数字”继续

Making next button continue from current "number"

本文关键字:下一步 数字 继续 按钮      更新时间:2023-09-26

我一直在尝试在我的网站上获得一个从当前数字继续的下一个按钮。但每次都是从1开始。任何帮助我都很感激。当我点击pNext按钮时它会改变H1和段落,并在我创建的八个不同选项之间循环。

我有几个按钮直接链接到每个单独的数组。7号按钮。如果我点击下一步在点击了7之后我想让它变成8> 1> 2,等等。但是它直接指向1

 <!-- NEXT BUTTON -->
    <script>
        $(document).ready(function () {
            var textArray = [];
            textArray[0] = "market.';    
            textArray[1] = 'area.';    
            textArray[2] = 'involved.';    
            textArray[3] = 'solution.';   
            textArray[4] = 'situation.';    
            textArray[5] = 'unit.';    
            textArray[6] = 'place.';    
            textArray[7] = 'parts.';   
            var idx = 0;
            $('#pNext').on('click', function(){
                idx++;
                var newidx = idx % textArray.length;
                $('#pText').text(textArray[newidx]);
            });
        });
        $(document).ready(function () {
            var textArray = [];
            textArray[0] = 'Better';    
            textArray[1] = 'Better';    
            textArray[2] = 'Safer';    
            textArray[3] = 'Intuitive';   
            textArray[4] = 'One';    
            textArray[5] = 'Better';    
            textArray[6] = 'Theft';    
            textArray[7] = 'Quality';   
            var idx = 0;
            $('#pNext').on('click', function(){
                idx++;
                var newidx = idx % textArray.length;
                $('#pHeadline').text(textArray[newidx]);
            });
        });
        $(document).ready(function () {
            var textArray = [];
            textArray[0] = '1';    
            textArray[1] = '2';    
            textArray[2] = '3';    
            textArray[3] = '4';   
            textArray[4] = '5';    
            textArray[5] = '6';    
            textArray[6] = '7';    
            textArray[7] = '8';   
            var idx = 0;
            $('#pNext').on('click', function(){
                idx++;
                var newidx = idx % textArray.length;
                $('#pNumber').text(textArray[newidx]);
            });
        });                   
    </script>

访问索引自增变量后,在代码中首先自增,然后从1

$('#pNext').on('click', function(){
   var newidx = idx % textArray.length;
   $('#pNumber').text(textArray[newidx]);
   idx++;
});

代码看起来很好(除了textArray[0] = "market.';)。请检查小提琴

$(document).ready(function () {
            var textArray = [];
            textArray[0] = 'market.';    
            textArray[1] = 'area.';    
            textArray[2] = 'involved.';    
            textArray[3] = 'solution.';   
            textArray[4] = 'situation.';    
            textArray[5] = 'unit.';    
            textArray[6] = 'place.';    
            textArray[7] = 'parts.';   
            var idx = 0;
            $('#pNext').on('click', function(){
                idx++;
                var newidx = idx % textArray.length;
                $('#pText').text(textArray[newidx]);
            });
        });
$(document).ready(function () {
            var textArray = [];
            textArray[0] = 'Better';    
            textArray[1] = 'Better';    
            textArray[2] = 'Safer';    
            textArray[3] = 'Intuitive';   
            textArray[4] = 'One';    
            textArray[5] = 'Better';    
            textArray[6] = 'Theft';    
            textArray[7] = 'Quality';   
            var idx = 0;
            $('#pNext').on('click', function(){
                debugger;
                idx++;
                var newidx = idx % textArray.length;
                $('#pHeadline').text(textArray[newidx]);
            });
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="pText"></p>
<p id='pHeadline'></p>
<button id='pNext'>Click</button>

这是一段新代码。它可以按照您的要求工作。

$(function() {
  var textArray = [];
  textArray[0] = 'market.';
  textArray[1] = 'area.';
  textArray[2] = 'involved.';
  textArray[3] = 'solution.';
  textArray[4] = 'situation.';
  textArray[5] = 'unit.';
  textArray[6] = 'place.';
  textArray[7] = 'parts.';
  var idx = 0;
  $('#pNext').on('click', function(){
    idx = idx == textArray.length?0:idx;
       $('#pText').text(textArray[idx++]);
    });
})