使“下一步”按钮从当前“数字”继续
Making next button continue from current "number"
我一直在尝试在我的网站上获得一个从当前数字继续的下一个按钮。但每次都是从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++]);
});
})
相关文章:
- 如何禁用在Bootstrap中不完成一步就转到下一步
- 将“下一步”和“上一个”按钮添加到较大的图像
- 引导表单向导 - 防止在提交 ajax 响应的每个页面表单出现错误时滚动到下一步
- 如何创建一个“下一步”按钮,使用 Java 脚本和 Twitter Bootstrap 切换选项卡
- 如何在单击下一步时使文本移动/更改
- 您如何控制在填写表单时单击下一步时 iOS/Android 将关注哪个字段
- Jquery UI选项卡-根据输入字段值,使用“下一步”/“上一步”按钮推进选项卡
- Jquery选项卡单击时高亮显示'下一步'按钮
- 如何解析用户对象以返回屏幕名称并继续下一步操作
- 如何点击谷歌饼图进入下一步行动
- 转到下一步时更改输入值
- 尝试在JavaScript中制作下一步按钮以显示JSON数组
- 跳转到 CasperJS 中步骤超时的下一步
- 如何在 UI 引导分页中禁用下一步按钮
- 等待几秒钟,然后再运行下一步量角器
- 如何在textField上使用zIndex,这样当我在Titanium中按下一步时,我可以移动到其他textField
- 到达最后一个元素时隐藏下一步按钮
- 通过单击“MVC 获取错误”中的“下一步”按钮 asp.net 在同一详细信息页面上显示记录
- 自定义 JS 图像查看器在每次按下“下一步”键后加载速度较慢
- 使“下一步”按钮从当前“数字”继续