2016-09-27 2 views
1

Я пытался получить следующую кнопку на своем сайте, чтобы продолжить с текущего номера. Но это начинается с 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

, кажется, работает здесь - https://jsfiddle.net/ezeqy5ff/4/ –

+0

@ freedomn-м отрываться меня – TheWandererr

+0

ваш код выглядит он содержит некоторые повторяющиеся части, вы можете по крайней мере, отправить как часть html? – mondersky

ответ

0

Вот новый код. Он отлично работает в соответствии с вашим требованием.

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

Эй, Ахиль, извините. Я действительно не понимаю. Я новичок в java. – Calvarium

+0

Не волнуйтесь, это не Java, это Javascript. Первая и последняя строка должны быть понятными. Вторая строка проверяет, меньше ли индекс (idx) как длина (количество элементов) вашего текстового массива. Если индекс меньше, ваш «#Headline» -Textcontent будет заменен на следующий элемент из вашего textArray. (idx ++) – Sascha

+0

Но остановится на последнем пункте. Поскольку это «следующая» кнопка, это разумно, но не соответствует коду вопроса, который возвращается к началу. Кроме того, если этот код был повторен 3 раза для каждого из текста/заголовка/номера, он скакал бы неправильно. Можете ли вы предоставить полную версию для всех трех разделов? –

1

После индекса доступа переменной приращения, в программном коде первого приращения затем начать с 1

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

Пожалуйста, отредактируйте с дополнительной информацией. Только код и «попробуйте» ответы не приветствуются, поскольку они не содержат содержимого, доступного для поиска, и не объясняют, почему кто-то должен «попробовать это». – abarisone

0

Код выглядит хорошо для меня (кроме 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>

Смежные вопросы