如何动态单击所有列表项，而不显示其默认行为的结果，但不可见地加载其内容

我想动态地单击一组无序列表项，而不显示单击的结果。其目的是预加载动态内容，如点击列表项通常会加载和显示的图像和文本;我想在用户开始点击列表项目之前尽可能多地预加载内容。(我从另一个开发人员那里继承了代码，我不得不在他的例程的约束下工作，所以请原谅我。)

每个列表项都有一个ID，如:

id="w273"
id="w175"
id="w123"

这些是我的参考资料。列表项是动态生成的，每个列表项都包含一个指向内容的HREF，该内容将显示在页面的散列区域中(内容由服务器加载的图像和使用查询从SQL数据库提取的文本组成)。

通常，单击列表项会更改页面中该区域的内容，但这需要时间来加载。不过，一旦它被加载，它就可以在不重新加载的情况下重新显示，所以重新访问它是即时的……初次拜访需要时间。

因此，我想通过连续动态单击列表项的每个来预加载所有内容，而不显示结果内容，所有这些都在后台完成，保留默认内容(使用单击列表中的第一个ID自动检索)。(我提到这个细节是为了解释页面最初加载时显示第一个列表项的内容，并且该行为应该保持不变。)

我如何用Javascript或JQuery完成这个?

更多信息

好吧，事情是这样的。内容由包含php脚本的主脚本通知，该脚本包含来自内部php脚本的内容。外部脚本创建一个图像轮播，其缩略图以散列形式引用内部脚本。在任何给定的点，URL将采用以下形式:

g.php?g_id=45#a.php?a_id=238

外部脚本是"g.p pphp "脚本。它在carousel中引用一个缩略图，该缩略图由"。php"脚本标识，该脚本的GET值是加载页面内部内容的关键。

carousel中的单个缩略图的HREF为:

<li><a href="#a.php?a_id=467" id="w467"><img src="thumb_image.jpg" /></a></li>

点击这个会将之前的URL修改为:

g.php?g_id=45#a.php?a_id=467

请注意，"g.p php"脚本生成的内容不会因此而改变。当单击轮播中对应的缩略图时，内部".php"内容以散列更改的形式切换。这是一个令人惊讶的有效解决方案，但有一些注意事项。

主要的警告是，除了第一个链接(对应于轮播中的第一个缩略图)引用的内容外，没有任何内容是预加载的，并且该行为是硬编码到例程中并且很好。

我只想动态地单击列表中的每个链接来加载所有内容，并在页面加载第一个链接的内容后在后台执行(这是它的默认行为，而且，正如我所说的，这很好)。而且必须在不为人知的情况下进行。

它发生的顺序也不重要，因为用户可能会立即推进旋转木马，点击其中的第14个元素，而不是第二个元素。所以，我不想以10个或类似的增量批量预加载内容，等待用户与旋转木马交互以加载更多内容;考虑到旋转木马的设计以及它打算如何以任何非顺序的方式使用，这是没有意义的。

我只需要循环遍历所有列表项链接，并以不可见的方式加载它们——只要有AJAX的异步特性，就可以按照它们应该按照的顺序加载。更有可能的是，用户将点击其中一个已经被预加载例程预加载的链接，但如果用户跳过并选择仍在预加载过程中的内容，这不是问题;当用户检查该内容时，其余内容将被预加载。

这是更多的信息。我希望这能提供一个更好的背景来理解我所面临的问题。在不完全重写整个例程的情况下，最好的办法似乎是接受它自己的机制，并通过循环AJAX/JQuery例程来适应它，该例程在页面显示其初始内容后在后台动态单击并预加载所有数据。我可以访问无序列表中链接的id;其他识别信息可以很容易地添加到其中。

[
  {
    "id" : "w125",
    "image" : "path/to/image1.jpg",
    "content" : "HTML or whatever"
  },{
    "id" : "w275",
    "image" : "path/to/image2.jpg",
    "content" : "HTML or whatever is the content"
  }
]