Javascript 使用“下一步”和“预览”按钮隐藏多个按钮

我有十个按钮，下一个和上一个按钮， 当我单击next按钮时，它应该显示接下来的两个按钮（隐藏其余按钮）。 单击“上一个”按钮（显示前两个按钮（隐藏其余按钮））时，应发生相反的情况

谢谢

我的html代码是：

<div>
<button class="menu">M1</button>
<button class="menu">M2</button>
<button class="menu">M3</button>
<button class="menu">M4</button>
<button class="menu">M5</button>
<button class="menu">M6</button>
<button class="menu">M7</button>
<button class="menu">M8</button>
<button class="menu">M9</button>
<button class="menu">M10</button>
</div>
<div>
<button class="action" id="btnNext">Next</button>
<button class="action" id="btnPreview">Previous</button>
</div>

M1
平方米
M3
M4
M5
M6
M7
M8
M9
M10
下一个
以前的

首先隐藏除前两个按钮外的所有按钮

$("#btnNext").on('click', function(){
    var vBtn = $(".menu:visible:last");
    $(".menu").hide();
    vBtn.next().show();
    vBtn.next().next().show();
});

$("#btnPreview").on('click', function(){
    var vBtn = $(".menu:visible:first");
    $(".menu").hide();
    vBtn.prev().show();
    vBtn.prev().prev().show();
});

---

我手动编码未测试，请检查

$("button.menu").not(':eq(0),:eq(1)').hide();
var count = 1;
$("#btnNext").click(function() {
       $("button.menu").hide();
       count = count + 2;
       $("button.menu").eq(count-1).show();
       $("button.menu").eq(count).show();
});

$("#btnPreview").click(function() {
       $("button.menu").hide();
       count = count - 2;
       $("button.menu").eq(count-1).show();
       $("button.menu").eq(count).show();
});

---

您一次只想显示两个按钮，我的理解正确吗？单击下一步/上一步显示下一步/上一步两个按钮？是，您理解