无法通过单击 Facebook 帖子中的三个点来触发弹出框
Posted
技术标签:
【中文标题】无法通过单击 Facebook 帖子中的三个点来触发弹出框【英文标题】：Not able to a make a popover which gets triggered by clicking on the three dots like in facebook posts 【发布时间】：2021-10-25 06:34:08 【问题描述】：我的 django 模板中有一个帖子列表，我希望在每个帖子上放置三个点，并且希望在我单击三个点时触发弹出框，并且弹出框应该具有可点击的选项，例如删除和复制链接。您可以查看 instagram 和 facebook 帖子以获得更好的想法。提前致谢。
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div></div>
<a href="#" data-toggle="popover" title="Popover Header" data-content="Some content inside the
popover"><span>⋮</span></a>
<style>
span
content: "\22EE";
</style>
<script>
$(document).ready(function()
$('[data-toggle="popover"]').popover();
);
</script>
我尝试了这段代码，但选项不可点击，而且我无法在弹出窗口中显示多个选项
【问题讨论】：
你可以这样做：$(document).on('click','.popover .popover-content',function())
【参考方案1】：
首先，如果可能，我建议您使用更新版本的引导程序。在撰写本文时，这是引导程序 5。
您可能想要的不是弹出框，而是下拉列表。 也许您应该花一些时间阅读引导文档。您可以在此处找到有关下拉列表的文档：https://getbootstrap.com/docs/5.1/components/dropdowns/
您在引导程序 5 中的示例可能如下所示：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Popover Example</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
</head>
<body>
<div class="btn-group dropend">
<button type="button" class="btn" data-bs-toggle="dropdown" aria-expanded="false">
⋮
</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Delete</a></li>
<li><a class="dropdown-item" href="#">Copy Link</a></li>
</ul>
</div>
</body>
</html>【讨论】：
但实际上这些选项仍然不可点击。如果我单击“弹出框内的某些内容”，则不会发生任何事情。另外，如何在弹出窗口中显示多个选项，例如“删除”和“复制链接”。 现在我了解您想要实现的目标。 bootstraps popover 仅用于显示附加信息。你想要的是一个菜单或下拉菜单，因为它在引导程序中被调用。我将编辑我的答案。以上是关于无法通过单击 Facebook 帖子中的三个点来触发弹出框的主要内容，如果未能解决你的问题，请参考以下文章
Facebook - 需要 publish_actions 权限，无法提交应用以供审批
是否可以通过 API 将计划中的帖子添加到 Facebook 页面？