单击任何地方关闭MagnificPopup ajax框 [英] Click anywhere closes MagnificPopup ajax box

查看:109
本文介绍了单击任何地方关闭MagnificPopup ajax框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

每当我尝试填写登录表单(这是一个巨大的弹出式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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆