如何按增量制作下一个/上一个链接？

Question

我想在页面上有一个下一个链接，以查看下一集。 我想逐步做。 我有这个但是不能用。

<p><a id="asdf" href="sample-1">Next</a> 
<script>
document.getElementById('asdf').addEventListener('click', function(e) {
var n = e.target.href.split('-')[1] * 1 + 1;
if (n > 4)
n = 1;
e.target.href = e.target.href.split('-')[0] + '-' + n + ".php";
}, false);
</script>
<div class="div3">
<ul>
<li><a href="sample-1.php">Anohana Ep1</a></li>
<li><a href="sample-2.php">Anohana Ep2</a></li>
<li><a href="sample-3.php">Anohana Ep3</a></li>      
</ul>
</div>

我应该首先确定当前页面的文件名吗？

Answer 1

使用parseInt转换为数字：

document.getElementById('asdf').addEventListener('click', function (e) {
    var n = parseInt(e.target.href.split('-')[1]) + 1;
    if (n > 4) n = 1;    
    e.target.href = e.target.href.split('-')[0] + '-' + n + ".php";
}, false);

说明 。 您的代码存在的问题是，在第一次单击href之后， href变成了sample-1.php 。 拆分时会生成一个数组['sample', '1.php'] 。 然后，当您尝试使用乘法运算符*将1.php转换为数字时，它当然会返回NaN 。 因此，在这种情况下，您应该使用parseInt ，它将正确提取数字部分。

演示： http ： //jsfiddle.net/1jworgLu/