Javascript 在jQuery中显示多个HTML页面的任何选项

我是jQuery新手，尝试创建一个包含多个HTML页面的代码的HTML文件。我甚至知道，在jQuery mobile中，可以在单个文件中链接其他HTML页面。那么，在jQuery而不是jQueryMobile中，是否有任何选项可以在单个html文件中实现多个html页面呢。任何建议。提前谢谢

这是我的密码：

<div id="coo drinks">
    <ahref="hot.html">hot</a>
    Coke, Fan ta, Miranda Etc.
</div>
<div id="hotdrinks">
    coffee, tea etc
</div>

可口可乐、芬达、米兰达等。
咖啡、茶等

---

因此，在上面的代码中，我想在页面加载时显示第一个

div

，即coo饮料，然后当我单击热链接时，它必须打开

div

，其

id

为“热”。但是这些东西必须在一个HTML文件中。

使用jQuery的加载功能

$("#div").load("page.html");

“内容必须在单个HTML文件中”， 因此，只需隐藏div，单击链接即可显示内容

<div id="coo drinks">
   <a class="hotdrink" href="hot.html">hot</a>
   Coke, Fan ta, Miranda Etc.
</div>
<div id="hotdrinks" style="display:none">
    coffee, tea etc
</div>

可口可乐、芬达、米兰达等。
咖啡、茶等

剧本

<script type="text/javascript">
    $(function() {
        $(".hotdrink").click(function(event){

        $("#hotdrinks").show();
        event.preventDefault();
        });
    });  
</script>  

$（函数（）{
$（“.hotdreak”）。单击（函数（事件）{
$（“#热饮料”）.show（）；
event.preventDefault（）；
});
});  

您想使用iframe元素吗？我想您指的是单个HTML页面，对吗？如果是，请使用加载内容ajax@roasted：有关于ajax的例子吗？Shinov T：谢谢你的回复。但最初我的热饮料应该是隐藏的，无论何时我点击热链接，它都必须显示（）；，关于这方面的任何建议。你可能错过了他对你的html所做的更改。它目前的工作方式与您指定的类似。我是这样实现的：$（function（）{$（“#login”）.hide（）；$（“#login”）。单击（function（event）{$（“#login”）.show（）；$（“.container”）.hide（）；event.preventDefault（））；但我无法单击“上一步”按钮。