Question

我需要从数据库加载数据来创建菜单，如何将数据传递给Ajax请求，需要Ajax请求？当我在菜单中单击时，将只加载在选项卡窗格中单击的链接，而不是全部3，我没有找到关于此特定主题的任何内容：

 <ul class="nav nav-tabs">
 <li class="active"><a href="#home">Home</a></li>
 <li><a href="#menu1">Menu 1</a></li>
 <li><a href="#menu2">Menu 2</a></li>
 <li><a href="#menu3">Menu 3</a></li>
 </ul>

<div class="tab-content">
<div id="home" class="tab-pane fade in active">
  <h3>HOME</h3>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div id="menu1" class="tab-pane fade">
  <h3>Menu 1</h3>
  <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
  </div>

php的例子：

Dynamic Bootstrap Tabs using PHP/MySQL

http://www.99logic.com/how-to-create-dynamic-tab-using-ajax-jquery-in-php/

Answer 1

这与您引用的PHP链接的工作方式非常相似，因为它主要是客户端解决方案。

在浏览器中加载的基页需要具有整体标签结构。在此页面中，您必须处理单击事件到选项卡。在每个选项卡的单击处理程序上，您将发出ajax调用以从服务器检索相应的HTML。例如，这些端点的网址可以是/menu1，/menu2，依此类推。 Flask服务器定义这些端点并返回其中每个选项卡的内容。如果您愿意，可以将这些定义为Jinja2模板。客户端中的Ajax请求将具有完成回调，在那里您将获取来自请求的HTML并将其插入选项卡的正文中。对于除服务器端端点之外的所有内容，您可以从PHP解决方案中获取代码，这些代码应该都是相同的。

希望这有帮助！

如何使用模板jinja Flask加载ajax Bootstrap选项卡？

1 个答案: