我尝试将电子邮件表单实现为弹出式灯箱，但每当我在表单中输入一些信息时，灯箱就会消失，但覆盖仍然存在，因此它不会完全关闭。我试图确保只有“关闭”按钮关闭灯箱，而不是单击任何字段表单。
有人对它为什么这样做有任何建议或想法吗？
代码在这里；
HTML 表单....
<div id="quote">
<h1>Ask me for a quote...</h1>
<p>Click on the link below and fill in the form for a quote and I'll get in touch.
<br>
<a href="javascript:void();"
onclick="document.getElementById('underlay').style.display='block'; document.getElementById('lightbox').style.display='block';">Click here for a Quote...</a>
<div id="underlay">
</div>
<div id="lightbox">
<div id="stylized" class="myform2">
<form id="form1" action="mail.php" method="POST">
<label>Name
<span class="small">Add your name</span>
</label>
<input type="text" name="name">
<label>Email
<span class="small">Enter a Valid Email</span>
</label>
<input type="text" name="email">
<label>Phone
<span class="small">Add a Phone Number</span>
</label>
<input type="text" name="phone">
<br />
<br />
<label>Course Type
<span class="small">Please selcet the preferred course </span>
</label>
<select name="course" size="1">
<option value="starter">Starter Course</option>
<option value="tuition">Personal Tuition</option>
</select>
<br />
<br />
<br />
<label>Prefered day
<span class="small">Please choose a preferred day </span>
</label>
<select name="days" size="1">
<option value="Tuesday">Tuesdays</option>
<option value="Sunday">Sundays</option>
</select>
<br />
<br />
<br />
<label>Message
<span class="small">Type Your Message</span>
</label>
<textarea name="message" rows="6" cols="25"></textarea><br />
<button type="submit" value="Send" style="margin-top:15px;" class='splash'>Submit</button>
<div class="spacer"></div>
</form>
</div>
<a href="javascript:void();" onclick="document.getElementById('underlay').style.display='none'; document.getElementById('lightbox').style.display='none';">Close</a>
</div>
这是CSS
#underlay{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background-color:#000;
-moz-opacity:0.5;
opacity:.50;
filter:alpha(opacity=50);
}
#lightbox{
display:none;
position:absolute;
top:100px;
left:25%;
width:50%;
height:500px;
background-color:#fff;
padding-top:30px;
}
任何人都有任何想法，将不胜感激！
汤姆