Question

大家。我有以下情况：

我有： http://example.com/和http://example.com/new

在example.com中，我使用fancybox iframe在example.com/new域中加载了一些表单。

我的表单，基本上显示了一些字段供用户输入他的pessoal数据，如姓名，电话等...在他提交之后，我会显示一些来自数据库的用户协议条款和一个用户的复选框说他同意这些条款。

在他检查并提交后，我想提醒一些成功消息和fancybox模态/ iframe关闭，就是这样。

在表单页面中，我已经加载了jquery和bootstrap。因此，当用户同意时，我打印：

<?php
     echo "
          <script>
          alert('Some success message!');

          $(document).ready(function(){
              parent.$.fancybox.close();
          });
         </script>
     ";
?>

我有三种形式，一种是有效的，另外两种，我得到：

Error: Permission denied to access property '$'

有效的表单和其他两个表单之间的唯一区别是，在有效的表单中，我没有来自数据库的协议条款，只有复选框。

我可以将我的整个代码放在这里，但这将是一个巨大的问题。但如果你们需要，我可以更新。

对不起我的英语，请原谅我，如果我不清楚的话。

更新

<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <?php
        /* Connect with DB */
        require_once('require/conectar.php');

        if(!empty($_POST))
            foreach($_POST as $k => $v)
                $$k = $v;
    ?>

    <script type="text/javascript" src="http://example.com/new/assets/js/jquery.js"></script>
</head>
<body>
<?php if(!isset($agree) and !isset($next)):     ?>
    <h1>The form</h1>
    <form method="post" action="">
        <label>Your name:</label>
        <input type="text" name="name">
        <br>
        <label>Your email:</label>
        <input type="text" name="email">
        <br>
        <input type="submit" name="next">
    </form>
    <?php
        else:
            $error = (!isset($name)) ? true : false;
            $error = (!isset($name)) ? true : false;

            if($error)
            {
                echo '<script>You must fill all fields before submit.</script>';
                exit;
            }

            $qrr = mysql_query("SELECT * FROM `terms`");
            $terms = mysql_fetch_object($qrr);
    ?>
        <h1>Terms:</h1>
        <?php echo $terms->content; ?>
        <form method="post" action="">
            <input type="hidden" value="<?php echo $name; ?>" name="name">
            <input type="hidden" value="<?php echo $email; ?>" name="email">
            <input type="checkbox" value="1" name="accept"> I agree.
            <input type="submit" name="agree">
        </form>
    <?php
        endif;
        if(isset($agree))
        {
            /*
                Here i mail me the user data.
            */

            echo "
                <script>
                alert('Soliciação Realizada com sucesso!');
                $(document).ready(function(){
                    parent.$.fancybox.close();
                });
                </script>
            ";
        }else
        {
            echo "<script>alert('You need to agree with the terms to proceed.');</script>";
        }
    ?>
    </body>
</html>

Answer 1

这是一个浏览器安全问题。虽然有几种方法，但最好的方法是使用postMessage API。

在您的example.com父页面上，添加如下代码：

function handleMessageFromiFrame(event) {
  alert('Some success message: ' + event.data);
  //$.fancybox.close();
}

window.addEventListener("message", handleMessageFromiFrame, false);

然后，在您的孩子example.com/new iframe上，添加如下代码：

var parentOrigin = "*"; // set to http://example.com/ or whatever for added security.

function sendMessageToParent(){
  parent.postMessage("button clicked", parentOrigin);
}

$('#submit-btn').click(sendMessageToParent);

这是一个实际的例子：

父示例网页：http://jsbin.com/hiqoyevici/1/edit?html,js,output
Child example.com/new iframe：http://jsbin.com/goferunudo/1/edit?html,js,output

单击子页面中的按钮时，它使用postMessage通知父级。然后父母听取消息并做你想做的任何动作。

错误：拒绝访问属性的权限＆＃39; $＆＃39;

1 个答案: