jquery - 使用 jQuery 获取另一个文件列表中的下一个 href？

Question

我查了又查，似乎我被这个问题困住了。不知何故，我认为这不会太难，而且可能不适合任何对 jQuery 有更多了解的人。

我有一个 .html 文件，我们将其称为“originalfile.html”，其中包含几个列表，如下所示:

<div id="content">
    <ul id="firstlist">
       <li class="link1"><a href="/path/link1.html" target="_blank"></a></li>
       <li class="link2"><a href="/path/link2.html" target="_blank"></a></li>
       <li class="link3"><a href="/path/link3.html" target="_blank"></a></li>
    </ul>
    <ul id="secondlist">
       <li class="link4"><a href="/path/link4.html" target="_blank"></a></li>
       <li class="link5"><a href="/path/link5.html" target="_blank"></a></li>
       <li class="link6"><a href="/path/link6.html" target="_blank"></a></li>
    </ul>
</div>

链接在新窗口中打开，在“link(x).html”文件中，我希望“上一个”和“下一个”按钮能够在现已关闭的原始文件中继续向上/向下移动列表当在 div #content 中的所有列表中点击 ==0 时，可以通过某种方式返回 :first href，或者换句话说，是一个循环。

“下一个”和“上一个”按钮应从 _self 窗口中的原始文件打开列表中的下一个/上一个链接，其中下一个文件将具有相同的按钮，依此类推。

我不知道我的做法是否正确，但我已经做到了这一点:

我通过使用获取当前文件名

var filename = location.pathname;

然后我使用获取原始列表

$.ajax({
   url: '/path/originalfile.html',
   success: function(response) {
   $("#linkdiv").html(jQuery(response).find('#content').html());
   });

我正在使用新的 div“#linkdiv”，然后在该 div 中搜索当前文件名

$("#linkdiv a[href=(filename)]");

我无法使其正常工作，以及如何找到 next() 和 prev() href 等。我相信我可能在某个地方错过了 .live？

现在的问题是，有没有办法做这样的事情:

    $.ajax({
   url: '/path/originalfile.html',
   success: function(response) {

   $("#next").html(jQuery(response).
   find('href with same value as current filename').
   next("href");

   $("#prev").html(jQuery(response).
   find('href with same value as current filename').
   prev("href");
   });

现在我知道这段代码不起作用，但是有没有办法通过使用当前文件名来查找 href，然后获取上一个和下一个 href 并将它们附加到 ID 为 #next 和 #prev 的按钮上？ ??

Answer 1

jQuery 似乎不是适合这项工作的工具。如果您确实有 6 个单独的页面，那么它们每个页面都会有自己的一组导航按钮。如果您正在做某种模板或生成的代码，请说明这一点。

还不确定为什么要打开新窗口？

HTML Page 1

<ul id="firstlist">

   <li class="link2"><a href="/path/link2.html" target="_blank">Next</a></li>
   <li class="link3"><a href="/path/link3.html" target="_blank">3</a></li>
</ul>

HTML Page 2

<ul id="firstlist">
   <li class="link1"><a href="/path/link1.html" target="_blank">Previous</a></li>

   <li class="link3"><a href="/path/link3.html" target="_blank">Next</a></li>
</ul>

HTML Page 3

<ul id="firstlist">
   <li class="link1"><a href="/path/link1.html" target="_blank">1</a></li>
   <li class="link2"><a href="/path/link2.html" target="_blank">Previous</a></li>

</ul>