我需要帮助来创建弹出表单。 这是我的 html 代码和 jquery 代码的一部分:
<body id ="bdy" onclick = "check(event)" style="overflow:auto;">
<div id="ric">
<!-- Popup div starts here -->
<div id="popupContact">
<!-- contact us form -->
<form action="#" method="post" id="form" >
...
</form>
</div>
<!-- Popup div ends here -->
</div>
<!-- display popup button -->
<CENTER><h1>Click Button To Popup Form Using Javascript</h1>
<button id = "popup" onclick ="div_show()">Popup</button></CENTER>
</body>
对于 Jquery:
//function to display Popup
function div_show(){
document.getElementById('ric').style.display = "block";
}
//function to check target element
function check(e){
var target = (e && e.target) || (event && event.srcElement);
var obj = document.getElementById('ric');
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('ric'))
{
return false
}
else if(t==document.getElementById('close'))
{
return true
}
t=t.parentNode
}
return true
}
这是CSS的一部分:
#ric{
width: 100%;
height: 100%;
opacity: 0.95;
top: 0;
left: 0;
display: none;
position: fixed;
background-color: #313131;
overflow:auto;
}
上面的css应该隐藏div,但是当我运行它时,div仍然显示。 我的代码有问题吗? 如果您还有其他显示弹出表单的简单示例,请与我分享。
最佳答案
当您将 div id 从 'abc' 更改为 'ric' 时,您还应该将 css 定义的名称从 'abc' 更改为 'ric'
关于javascript - 弹出式表格不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25482954/