时间戳

首页 > 解决方案 > 单击按钮时如何打开模式

javascript - 单击按钮时如何打开模式

问题描述

在我正在编码的博客的评论部分中，我希望管理员能够删除评论。

我在每条评论旁边都有一个按钮，我希望在delete button单击时打开一个模式框。

在这个模态框中，我想再次询问是否应该删除评论，如果是，那么它应该引导我回到帖子并且应该删除评论。

我需要javascript来做到这一点吗？不幸的是，我是 php 新手，我想知道是否可以只使用 html 和 css 来完成。

我有一个PostsController.php网站在其中呈现（操作页面），我有一个CommentsRepository.php与数据库表的连接comments发生的地方。

这是评论部分的一部分：

<div class="comments-list">
 <?php foreach ($comments AS $comment): ?>
  <div class="one-comment">
   <p><?php echo e($comment->content); ?></p>
   <div class="one-comment-edit">
    <input type="button" value="x" name="delete" class="delete-comment" />
   </div>
  </div>
 <?php endforeach; ?>
</div>

我知道如何进行查询，但是我不知道单击按钮时如何打开模态框。

如果有人可以帮助我，我将不胜感激，特别是如果我需要 javascript 来做到这一点。

标签： javascriptphphtmlbuttonmodal-dialog

解决方案

你不需要javascript，但它确实让事情变得更容易！

我发现了一些在没有任何 javascript 的情况下打开的弹出窗口示例。我觉得这个很有趣：

为此，他们创建了一个带有visibility: hidden;css 属性的弹出窗口，并使用目标伪类将此属性设置为visibility: visible;

为了触发目标伪类，他们创建了一个链接（就像一个按钮），它引用了您的弹出窗口的ID 。

该链接将针对您的弹出窗口，触发目标伪类，并显示您的弹出窗口！

还有 Jeppe Spanggaard 推荐的Bootstrap选项，效果很好！

希望它以任何方式有所帮助！

推荐阅读