Question

图片滑块只有一个img tag和四个<img>标签作为选择器。我想将选择器合并到一个前向选择器中，但js代码不起作用，因为我将i替换为i+1。

任何帮助都将不胜感激。

function middle_pic(i) {
  document.getElementById('placeholder').src = 'images/products_center_middle_img' + i + '.png';
}

<div id="middle-img-pic">
  <img src="images/products_center_middle_img1.png" id="placeholder">
</div>
<img src="images/selector.png" onClick="middle_pic('1');">
<img src="images/selector.png" onClick="middle_pic('2');">
<img src="images/selector.png" onClick="middle_pic('3');">
<img src="images/selector.png" onClick="middle_pic('4');">

Answer 1

您传递给该函数的变量i不是int，因此i+1不会增加i的值。

您可以使用parseInt(i)来解析字符串中的整数。这应该工作

var i=0
function middle_pic() {
  i=i+1;
  document.getElementById('placeholder').src = 'http://dummyimage.com/600x400/000/fff&text=Image' + (parseInt(i)+1);
}

<div id="middle-img-pic">
  <img src="http://dummyimage.com/600x400/000/fff&text=Image1" id="placeholder">
</div>
<img src="images/selector.png" onClick="middle_pic();">

如何使用一个选择器的图像滑块？

1 个答案: