Question

我遵循了我网站的答案设置 Confirm deletion in modal / dialog using Twitter Bootstrap?

并使用GET食谱http://plnkr.co/edit/NePR0BQf3VmKtuMmhVR7?p=preview&preview

但是当我以完全相同的方式应用所有代码时，删除按钮什么都不做...

我验证了jquery脚本位于头部，尝试重新排列元素块，但似乎无济于事……我已经查看了至少30次，但我真的感到困惑，为什么它根本不起作用...

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="modal fade" role="dialog" tabindex="-1" id="delete-confirm">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Are you sure?</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button></div>
      <div class="modal-body">
        <p>Deleting your server listing is permanent!</p>
      </div>
      <div class="modal-footer">
        <button class="btn rounded-pill" type="button" data-dismiss="modal">Cancel</button>
        <a href="" class="btn rounded-pill delete-btn">Delete</a></div>
    </div>
  </div>
</div>
<article class="d-block">
  <div class="article-div">
    <!-- Start: Server -->
    <?php
            if($getServers->num_rows > 0){
                foreach($getServers as $server){
                    $sname = $server['servername'];
                    $ssid = $server['sid'];
                    $sindex = $server['pageindex'];
                    echo "<div class=\"d-inline-block\" style=\"padding-top: 0px;padding-bottom: 0px;width: 128px;margin-left: 10px;margin-right: 10px;\">";
                    echo "<a class=\"d-block\" href=\"$sindex\" style=\"color: #000;font-weight: bold;\">$sname<img src=\"/assets/img/server.png\" style=\"width: 128px;\"></a>";
                    echo "<form action=\"/account/my-servers/edit.php\">";
                    echo "<button class=\"myserver-edit\" type=\"submit\">Edit</button>";
                    echo "<a class=\"myserver-delete\" href=\"#\" data-href=\"delete-server.php?sid=$ssid\" data-toggle=\"modal\" data-target=\"#delete-confirm\">Delete</a>";
                    echo "</form>";
                    echo "</div>";
                }
            }
            ?>
      <!-- End: Server -->
      <script>
        $('#delete-confirm').on('show.bs.modal', function(e) {
          $(this).find('.delete-btn').attr('href', $(e.relatedTarget).data('href'));
        });
      </script>
  </div>
</article>

（顶部是模式，PHP块是触发模式的形式，底部当然是脚本）

Answer 1

好吧，因此在使用Inspect Element进行故障排除之后，似乎JQuery脚本未导入，因为我正在HTTPS中加载页面，但试图通过HTTP导入资源。因此，在将标题中的内容修复后，现在可以使用了。

删除确认模式不获取数据-href

1 个答案: