Question

我的JS脚本问题如下。我创建了一个照片库，每个照片库都有一个标题。我用数组来创建标题。但是，在第一页上，标题是1;在第二页上，标题是，（逗号）;第三，标题是2;在第四页上，标题是，（逗号）等。我希望标题是1,2,3,4,5,6。我很困惑为什么逗号可以是标题。有没有解决方案？

＆＃13;

var num;
var name = ["", "1", "2", "3", "4", "5", "6"];

function change(n) {
  num = n;
  var path = "img/" + n + '.png';
  document.getElementById('text').innerHTML = name[n];
  document.getElementsByTagName("img")[0].src = path;
  return false;
}

function next() {
  if (num >= 6) {
    num = 1;
  } else {
    num = num + 1;
  }

  change(num);
}

function prev() {
  if (num <= 1) {
    num = 6;
  } else {
    num = num - 1;
  }

  change(num);
}

＆＃13;

<body onload="change(1)">
  <a href="#" onclick="prev()">Prev</a>
  <a href="#" onclick="change(1)">1</a>
  <a href="#" onclick="change(2)">2</a>
  <a href="#" onclick="change(3)">3</a>
  <a href="#" onclick="change(4)">4</a>
  <a href="#" onclick="change(5)">5</a>
  <a href="#" onclick="change(6)">6</a>
  <a href="#" onclick="next()">Next</a>

  <br>
  <br>
  <img src="" alt="" style="width:600px; height:320px">
  <br>
  <p id="text"></p>

</body>

＆＃13;

Answer 1

由于您在全局范围内定义name，它会覆盖window.name属性，即字符串，因此您的数组将转换为字符串,1,2,3,4,5,6而不是数组。使用其他变量名称names来避免这种情况。最好的方法是使用事件处理程序并将您的html与javascript分开，并且您将能够使用不会使用全局变量污染window对象的命名空间。

https://developer.mozilla.org/en-US/docs/Web/API/Window/name

Answer 2

您需要将name数组调用为其他内容。 name引用windows.name，如果为此变量指定值，则将其视为字符串。

var num;
var namedata = ["", "1", "2", "3", "4", "5", "6"];


function change(n) {
  num = n;
  var path = "img/" + n + '.png';
  document.getElementById('text').innerHTML = namedata[n];
  //document.getElementById('text').innerHTML = name
  document.getElementsByTagName("img")[0].src = path;
  return false;
}

function next() {
  if (num >= 6) {
    num = 1;
  } else {
    num = num + 1;
  }

  change(num);
}

function prev() {
  if (num <= 1) {
    num = 6;
  } else {
    num = num - 1;
  }

  change(num);
}

<body onload="change(1)">
  <a href="#" onclick="prev()">Prev</a>
  <a href="#" onclick="change(1)">1</a>
  <a href="#" onclick="change(2)">2</a>
  <a href="#" onclick="change(3)">3</a>
  <a href="#" onclick="change(4)">4</a>
  <a href="#" onclick="change(5)">5</a>
  <a href="#" onclick="change(6)">6</a>
  <a href="#" onclick="next()">Next</a>

  <br>
  <br>
  <img src="" alt="" style="width:600px; height:320px">
  <br>
  <p id="text"></p>

</body>

照片库上的数组无法正常工作

2 个答案: