Question

这是显示弹出联系表单的JS函数：

function check_empty(){
if(document.getElementById('name').value == "" 
|| document.getElementById('email').value == "" 
||document.getElementById('msg').value == "" ){
alert ("Fill All Fields !");
}
    else {  
    document.getElementById('form').submit();  
    alert ("Form submitted successfully...");
    }
}

//function to display Popup
function div_show(){ 
document.getElementById('abc').style.display = "block";
document.body.style.overflow = "hidden";
}

//function to check target element
function check(e){ 
var target = (e && e.target) || (event && event.srcElement); 

var obj = document.getElementById('abc'); 
var obj2 = document.getElementById('popup'); 
checkParent(target)?obj.style.display='none':null; 
target==obj2?obj.style.display='block':null; 
} 


//function to check parent node and return result accordingly
function checkParent(t){ 
    while(t.parentNode){ 
        if(t==document.getElementById('abc'))
            { 
                return false 
            }
        else if(t==document.getElementById('close'))
            {
                return true

            } 
        t=t.parentNode 

    } 
    return true 

}

当弹出窗口加载document.body.style.overflow = "hidden";停用溢出时。现在我想在关闭按钮单击时设置document.body.style.overflow = "visible";（当我关闭弹出窗口时）。关闭按钮在html中定义为：<img src="images/3.png" id="close"/>是否可能？这是完整的HTML格式：

 <form action="#" method="post" id="form" >
        <img src="images/3.png" id="close"/>
        <h2>Contact Us</h2><hr/>
        <input type="text" name="name" id="name" placeholder="Name"/>

        <input type="text" name="email" id="email" placeholder="Email"/>

        <textarea name="message" placeholder="Message" id="msg"></textarea>

        <a id="submit" href="javascript: check_empty()">Send</a>
    </form>

Answer 1

HTML

<img src="images/3.png" id="close" onclick="myFunction()">

JS

function myFunction() {
  document.getElementsByTagName("body")[0].style.overflow = "visible";
}

身体溢出：弹出关闭时可见

1 个答案: