单击任何地方关闭MagnificPopup ajax框 [英] Click anywhere closes MagnificPopup ajax box
问题描述
每当我尝试填写登录表单(这是一个巨大的弹出式ajax框)时,它都会在第一次单击时关闭.
Whenever I'm trying to fill login form (which is a magnific pop up ajax box) it gets closed in the first instance of click.
main.html
$(document).ready(function() {
$('.ajax-popup-link').magnificPopup({
type: 'ajax',
alignTop: false,
overflowY: 'scroll'
});
});
<a class="simple-ajax-popup-align-top" href="result.php">try me</a><br>
result.php
<div>
<form action="..." method="post">
Email:
<label class="field_container">
Password:
<input type='text' name='cust_username' id='username' maxlength="12" style="width: 250px; height: 30px" /></label>
<label class="field_container">
Password:
<input type='password' name='cust_password' id='password' maxlength="12" style="width: 250px; height: 30px" /></label>
<input type='submit' name='Submit' value='Login' />
</form>
</div>
推荐答案
请确保您正在"ajax-ing"的页面所包含的信息或标签所需要的信息不多. 例如.它应该像这样干净:
Make sure your page that you are "ajax-ing" isn't containing more info or tags than needed. E.g. it should be as clean as this:
<div>
<h3>Heading</h3>
<p>
Text
</p>
</div>
换句话说,请尝试避免使用多个<div>
,并且不要包含<html>
,<body>
等.不幸的是,这将导致问题中所述的行为,即弹出窗口关闭.我认为这是因为无法确定内容的实际位置,因此认为您单击了外部内容=>关闭了弹出窗口.
In other words, try avoiding multiple <div>
s and don't include <html>
, <body>
etc. That will unfortunately lead to the behaviour described in the question, of popup closing. I assume it's because it has trouble determining where the content actually is, so it thinks you clicked outside content => closes popup.
closeOnContentClick: false
默认情况下已经设置,因此不会起作用,但是可以尽可能简化代码.
is already set by default so that won't help, but cleaning up the code to as simple as possible might.
我还要提及一个替代方法: http://nyromodal.nyrodev.com/似乎可以使事情处理起来更加顺畅,并且还包含按id进行内容过滤.
I would also like to mention an alternative: http://nyromodal.nyrodev.com/, which seems to handle things way smoother, and also includes content filtering by id.
这篇关于单击任何地方关闭MagnificPopup ajax框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!