Javascript 如何通过Ajax（jQuery）预加载图像

我有一些Ajax标签，我通过。当我点击其中一个时，我看到一个预加载程序，当它加载时，它链接了相应的php文件，当它完成时，我可以看到新的内容。到目前为止还不错

问题是相应的选项卡没有预加载其内容的图像。但我想要一些标签，可以预加载其全部内容（包括图像）

我了解到，您可以通过Ajax请求预加载图像，但不知道如何使用

那么，如何将额外的图像加载器实现到中，以便（通过Ajax）预加载选项卡的全部内容（文本+图像）

这是我的jQuery UI选项卡的JS：

$(document).ready(function() {
    $('#home_tab').tabs({
      cache: true,

      beforeLoad: function(event, ui) {
        ui.ajaxSettings.type = 'POST';

        if ($(ui.panel).html()) {
          event.preventDefault();
        } else {
          ui.panel.html('<div class="tab_loader_home"></div>');
        }

        ui.jqXHR.success(function() { 
        });

        ui.jqXHR.error(function() {
        });
      }
    });
});

$（文档）.ready（函数（）{
$（“#主页选项卡”）。选项卡({
是的，
加载前：函数（事件、ui）{
ui.ajaxSettings.type='POST'；
if（$（ui.panel.html（））{
event.preventDefault（）；
}否则{
ui.panel.html（“”）；
}
ui.jqXHR.success（函数（）{
});
ui.jqXHR.error（函数（）{
});
}
});
});

这些是我的标签：

<div id="home_tab">
<ul id="shadetabs" class="ui-tabs">
    <li class="tab"><a href="#new">New Games</a></li>
    <li class="tab"><a href="sections/ajax/popular.php">Popular Games</a></li>
    <li class="tab"><a href="sections/ajax/top_rated.php">Top Rated Games</a></li>
</ul>
<div class="panel_container">
    <div id="new">
        <?php
            include ('./includes/homepage/new_games.inc.php');
        ?>
    </div>
</div>
</div>

---

有关更多信息，请参见此问题：

我不确定我是否理解您所说的“预加载”是什么意思。您是否希望在用户实际查看选项卡之前，选项卡上的内容？或者…别的什么？你能澄清一下吗？当我点击一个选项卡时，它会通过Ajax加载其内容。但它不会加载内容图像。我还希望通过Ajax加载图像（当我单击相应的选项卡时）。我更新了我的问题。