Question

我一直试图让我的网站上的下一个按钮继续当前的号码。但它每次从1开始。任何帮助我赞赏。所以这里发生的是当我点击pNext按钮时它应该改变H1和段落，并在我创建的八个不同选项之间循环。

我有几个按钮直接链接到每个单独的数组。所以一个7号按钮。如果我在点击了7之后点击了下一个，我希望它转到8＆gt; 1> 2＆gt;等等。但它直接转向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>

Answer 1

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

开始

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

Answer 2

这是一个新代码。它可以根据您的要求正常工作。

$(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++]);
    });
})

Answer 3

代码对我来说很合适（textArray[0] = "market.';除外）。请检查小提琴。

＆＃13;

$(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]);
            });
        });

＆＃13;

<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>

＆＃13;

使下一个按钮继续从当前＆＃34;数字＆＃34;

3 个答案: