我正在尝试在页面上的内容之间进行上一次滑动。我有以下标记：
<div class="right">
<a href="javascript:;" class="light-button" id="previous-button">Previous</a>
<a href="javascript:;" class="light-button" id="next-button">Next</a>
</div>
<?php foreach ($chapters as $chapter) : ?>
<div id="chapters-container-<?php echo $chapter->id; ?>" style="display: none">
<div class="left">
<h1 class="hmc"><?php echo $chapter->title; ?></h1>
</div>
<ul class="attachments scroll-pane">
<?php foreach ($chapter->files as $file) : ?>
<!--video zone-->
<?php if ($file->extension == '.mpeg') : ?>
<li class="wide">
<img src="" />
<span class="duration hmc"><?php $file->duration; ?></span>
<h1 class="hmc">The title is a title</h1>
</li>
<?php endif; ?>
<?php endforeach; ?>
</ul>
</div>
<?php endforeach; ?>
</div>
基本上，我使用PHP动态生成一些内容。我已经将生成的每个内容包装在div中，并且不会仅使用jQuery来显示它。现在我试着做一些类似的事情：
$('body').on('click', 'a#next-button', function(){
$('#chapters-container-').next();
});
但是ofc并没有像我想要的那样工作。当我根据我生成的标记在上一个按钮和下一个按钮之间切换时，我该如何更改内容。
我认为你没有得到什么
$('#chapters-container-').next();
确实如此。根据文件，
获取匹配元素。如果提供了选择器，它将检索下一个仅当它与该选择器匹配时为同级。
所以你只是选择id＝charges容器的元素之后的下一个元素-
你应该做这样的事情：
$('body').on('click', 'a#next-button', function(){
var visisbleContainer = $('div[id^=chapters-container-]:visible');
visisbleContainer.next().show();
visisbleContainer.hide();
});
当用户点击下一个按钮时，得到可见的div（章节）id属性。您将收到一个章节id，将1添加到这个章节id中，并生成另一个字符串，如chapters-container-2。
现在隐藏当前div并显示生成字符串的div，即$（'#'+newstring）.show（）