如何在页面上使用此JavaScript片段两次？

在一些帮助下，我使用了一些JavaScript。它看起来像：

<script>
  $(document).ready(function() {
    var $li = $('.eo-events li');

    $li.hide().filter(':lt(6)').show()

    var x = 6;

    $('#next, #prev').click(function() {
      var m = this.id === 'prev' ? 'first' : 'last';
      var $m = $li.filter(':visible')[m]()[this.id + 'All'](":lt(" + x + ")");
      if ($m.length == 0) return;

      var time = 250;

      $li.fadeOut(time);
      setTimeout(function() {
        $m.fadeIn(time);
      }, time);
    });
  });
</script>

---

我想我需要更改一个变量名。我已尝试将

x

更改为

y

，将

m

更改为

n

，并将

$li

更改为

$item

，但不起作用。我知道这可能是一个简单的调整，有什么想法吗？

你把这一行复杂化了：

var $m = $li.filter(':visible')[m]()[this.id + 'All'](":lt(" + x + ")");

使发现问题变得困难

---

似乎您希望链接方法

nextAll（）

或

prevAll（）

，但由于您在第二个实例中使用的ID最后有一个

1

，您将得到

nextAll（）

或

prev1All（）

。这些应该是抛出错误，指示方法不存在

将它们组合成1

$（document）.ready（）

函数…在当前结构中，所有变量都在每个

ready（）

回调中的局部范围内，因此没有冲突。没有足够的了解来帮助解决这个问题。创建一个复制问题的演示我将它们组合成一个

$（document）.ready（）

和“Prev”和“Next”链接仍然不起作用-我不知道这是否有帮助，但这是实际的开发站点：-“Events”部分是一个可以正常工作的部分，第二个在徽标的顶部-下“耶稣为什么重要？”部分。我想通过添加一个1，代码将查找prev1

id

而不是

prev

id…但是通过这个解释，我看到这将如何搞砸

nextAll（）

和

prevAll（）

我已将该行调整为

var m=this.id==='prev'？'first'：'last'；

应该修复一个，但下一个和上一个链接仍然断开。可以执行类似

var direction=this.id.replace（'1'，）

…然后

[direction+'All']

。就我个人而言，我会重写它，使整个想法更具可读性。可能使用类或数据属性而不是ID作为逻辑，这样它更通用，或者使用

this.ID.indexOf（'prev'））>-1

这非常有效！不幸的是，我对javascript的了解还不够，无法重写此函数。我同意，我肯定认为将这两个函数结合起来可能会更简单。我更新了小提琴：。非常感谢您的帮助！

var $m = $li.filter(':visible')[m]()[this.id + 'All'](":lt(" + x + ")");