Question

我有多个按钮，当前会重定向到不同的页面，供用户执行单个操作，然后他们需要在确认页面上点击另一个按钮返回之前的位置。这是老派，不方便......

我想要做的是创建一个单独的弹出框，当点击任何这些按钮时，它会被触发（出现）。在框中，我希望显示相关的.php文件，以便用户确认其操作，然后页面将重新加载并显示确认消息。

实施例： “删除”按钮需要触发确认-popup.php，其中包含delete.php文件，以便用户确认删除。

“取消”按钮需要触发确认-popup.php，其中包含cancel.php文件，以便用户确认取消。

这就是我所做的： - 创建弹出窗口并将其包含在他们的帐户页面上（这是所有按钮所在的位置）。 - 添加了一个JS，它通过按钮ID来触发弹出窗口

单击任一按钮时，弹出窗口显示正常。我陷入了不同的“动作”.php文件需要传递并包含在弹出窗口中的阶段。我知道我可以为它的相关动作创建多个弹出窗口，但是我们都知道这不是最佳实践，并且它会加倍。

任何帮助将不胜感激！

修改：在以下评论后添加了代码

HTML：

<a href="<?php bloginfo('siteurl') ?>/?a_action=delete_auction&pid=<?php the_ID(); ?>"><button class="button-small button-red" id="confirm-delete">Delete</button></a>

JS：

$(document).ready(function() {
    $("#confirm-delete").click(function() {

        if (!$(".confirm-popup").is(":visible")) {
            $(".confirm-popup").fadeIn("slow");
            return false;
        }
    });
});

PHP confirm_popup.php：

<div class="confirm-popup">
<?php include 'delete_auction.php'; ?>

</div>

Answer 1

您可以根据按下的按钮在弹出窗口中打开不同的iframe。这将允许您使用一个弹出窗口，您只需将iframe src属性编辑为正确的php页面。例如，您可以为每个按钮添加一个HTML属性，该按钮包含应该由按钮打开的页面的URL。然后你会得到一些JS代码，按下按钮会读取保存URL的属性并将其放在弹出窗口中的iframe src属性中。

使用jQuery这样的东西：

<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"><iframe src=""></iframe></div>

<script type="text/javascript">
$('.myclass').click(function(){
    $('.popup iframe').attr('src', $(this).attr('content-url'));
})
</script>

或AJAX方式：

<button class="myclass" cotent-url="delete.php">Delete</button>
<button class="myclass" cotent-url="save.php">Save</button>
<div class="popup"></div>

<script type="text/javascript">
$('.myclass').click(function(){
    $.ajax({
        url: $(this).attr('content-url'),
        data: {},
        success: function(response) {
            $('.popup').html(response);
        },
        dataType: 'html'
    });
})
</script>

在JS弹出窗口中包含不同的.php文件

1 个答案: