Question

因此，对于我的网站，我从数据库中读取数据，每个视频游戏都有一个描述，一旦使用PHP从数据库中接收到该描述，便将描述分为两部分，一部分可见，另一部分隐藏直到用户单击“阅读更多”。我在一个页面上有多个游戏，这意味着我有多个“自述”按钮。在我的JavaScript中，我具有代码，因此，当用户单击任何“自述”按钮时，所选按钮就会消失。

这是我遇到的问题，如何解决？当用户单击“自述”按钮之一时，将显示与该按钮相对应的隐藏文本？

这是我现在拥有的代码。

var readMoresList = document.getElementsByClassName("readMore");
for (var i = 0; i < readMoresList.length; i++) {
  readMoresList[i].addEventListener('click', function (e) {
  var selected = e.target;
  selected.style.visibility = 'hidden';

  //here i am selecting the second description that is hidden
  var reveals = document.getElementsByClassName("readMore");
  reveals[i].style.visibility = 'visible';

}); }

所以readMoreList变量是readMore按钮的数组，我得到了它们，并向它们添加了一个eventListener，等待它们被单击。揭示变量是隐藏描述的数组。

我要寻找的是如何进行设置，因此，当我单击自述按钮时，与该自述相邻的隐藏文本将可见。

谢谢

Answer 1

  //here i am selecting the second description that is hidden
  var reveals = document.getElementsByClassName("readMore");

否，您正在重新选择按钮。对隐藏的文本使用不同的类。

  reveals[i].style.visibility = 'visible';

在运行之前，i将始终等于readMoresList.length。 Closures inside loops can be counter-intuitive.

将一组隐藏文本中的项目从按钮数组中显示为对应的按钮

1 个答案: