WordPress-按下按钮时打开弹出窗口

Question

我在.php中有这段代码可以检索联系表：

    echo '<div class="hsk-column4 hsk-agency-inquiry-form">';
    echo hsk_agency_enquiry_form();
    echo '</div>';

当用id="btn-contact"按下按钮时，如何使弹出式窗口显示在联系表单中？

谢谢。

Answer 1

也许您在谈论模态？应该有帮助...

https://getbootstrap.com/docs/4.0/components/modal/

Answer 2

您可以使用jQuery

PHP：

<button id="btn-contact">Open Contact</button>

<?php
    echo '<div class="hsk-column4 hsk-agency-inquiry-form">';
    echo hsk_agency_enquiry_form();
    echo '</div>';
?>

jQuery：

jQuery(document).ready(function( $ ) {
$("body").on("click", function(){
$(".hsk-column4.hsk-agency-inquiry-form").removeClass("active-form");
});

$("#btn-contact").on("click", function(event){
$(".hsk-column4.hsk-agency-inquiry-form").addClass("active-form");
event.stopPropagation();
});

});

CSS：

.hsk-column4.hsk-agency-inquiry-form {
display: none;
}
.active-form {
display: block;
}