当用户单击<span>（x）时，关闭PHP中的模式</span>

Question

在PHP文件register.php内，我有以下警报文本：

echo '<div id="id01" class="box">' . '<div class="example">' . '<span class="close">&times;</span>' .'<h3>Thank you for registering! A confirmation email has been sent to your address. Please click on the link in that email in order to activate your account.</h3>'.'</div>'.'</div>';

我也有以下CSS代码：

<style>
    .box {       
    position: fixed; 
    z-index: 1; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0);
    padding-top: 60px;
}        
    .example {
    background-color: yellow;
    margin: 5% auto 15% auto; 
    border: 1px solid #888;
    width: 60%; 
    padding: 50px;
}

到目前为止，警报文字仍然可以正常运行。

当我尝试使用以下代码关闭框时出现的问题：

<script>
// When the user clicks on <span> (x), close the modal
span.onclick = function() {
    modal.style.display = "none";
}
</script>

不起作用！ 单击（x）时未关闭文本框，如何在PHP文件中运行此代码？

注意：这是基于以下w3shools模态代码的： https ://www.w3schools.com/howto/tryit.asp?filename = tryhow_css_modal

Answer 1

您应该尝试此代码。

PHP：

echo '<div id="id01" class="box" onclick= "closeBox()"> ....</div>';

JS：

function closeBox(){
           document.getElementById(“id01”).style.display=“none”;
}

Answer 2

您不应将其从外面移开。 内联做

echo '<div id="id01" class="box" onclick="$(this).remove();">' . '<div class="example">' . '<span class="close">&times;</span>'

要么

echo '<div id="id01" class="box">' . '<div class="example">' . '<span class="close" onclick="$("#id01").remove();">&times;</span>'