1

我是 webdesign/php 和 javascript 的新手，我遇到了问题。请看这段代码：

  <script type="text/javascript">
<!--
function thanksDiv(){
    document.getElementById("myThanksDiv").style.display ='block';
}
function hideDiv(id){
    document.getElementById(id).style.display='none';
}

//-->
</script>

        <form id="contacts-form" method="post" action="email.php" target="myiframe">
           <fieldset>

           <div class="alignright"><a href="#" onClick="document.getElementById('contacts-form').submit()">Send Your Message!</a></div>
           </fieldset>
        </form>

<iframe  name="myiframe" id="myiframe" src="" width=1 height=1 style="visibility:hidden;position:absolute;"></iframe>

<div id="myThanksDiv" style="width:200px;height:150px;position:absolute;left:50&#37;; top:20px; margin-left:-100px;border:1px solid black; background:#fff;display:none;padding:20px;">Thanks! <br />Your message was sent.</div>

在 email.php 中：

echo '<script type="text/javascript">'
   , thanksDiv();'
   , '</script>';
?>

这个想法是，当我点击“发送您的消息”时，我应该会看到一个框，上面写着“消息已发送”，但我没有。

如果我没有通过 email.php 页面，我只是从表单提交链接中调用thanksDiv，它可以工作。知道为什么吗？

4

4 回答 4

1

iframe 中的 javascript 与定义函数的父文档不在同一“范围”内。

为了调用它尝试：

echo '<script type="text/javascript">'
   , 'parent.thanksDiv();'
   , '</script>';

不同之处在于“父级”告诉 JS 在框架的父级中查找函数；）

请确保所有内容都在同一个域/端口上，否则您可能会违反同源策略，因此可能无法正常工作。

编辑

这是在我的机器（PHP5，Firefox）上运行良好的配置：

测试.html

<html>
<head>
  <script type="text/javascript">
  <!--
    function thanksDiv(){
      document.getElementById("myThanksDiv").style.display ='block';
    }
    function hideDiv(id){
      document.getElementById(id).style.display='none';
    }
  //-->
  </script>
</head>
<body>
  <form id="contacts-form" method="post" action="email.php" target="myiframe">
    <fieldset>
      <div class="alignright"><a href="#" onClick="document.getElementById('contacts-form').submit()">Send Your Message!</a></div>
    </fieldset>
  </form>

  <iframe  name="myiframe" id="myiframe" src="" width=1 height=1 style="visibility:hidden;position:absolute;"></iframe>

  <div id="myThanksDiv" style="width:200px;height:150px;position:absolute;left:50px;top:20px; border:1px solid black; background:#fff;display:none;padding:20px;">Thanks! <br />Your message was sent.</div>
</body>
</html>

电子邮件.php：

<?php
echo '<script type="text/javascript">parent.thanksDiv();</script>';
?>
于 2013-02-07T06:14:41.157 回答
0

表单页面中的所有内容都将在下一页中消失。所以不再有thanksDiv 函数。当您提交表单时，您将完全进入另一个页面。

直接调用该函数有效，因为您仍在该页面上。

success.html例如，创建一个页面，email.php而不是回显 js，请执行以下操作：

header('Location: http://www.yoursite.com/success.html');

这将重定向到成功页面。

于 2013-02-07T06:12:24.557 回答
0 
echo '<script type="text/javascript">'
   , 'thanksDiv();'
   , '</script>';

第二行缺少 '。

function thanksDiv(){
    document.getElementById("myThanksDiv").style.display ='block';
}

这个函数也应该在 email.php 中。或将其添加到单独的页面并在其中包含页面。

于 2013-02-07T06:12:27.083 回答
0

当您单击发送消息时

onclick="thanksDiv();";
于 2013-02-07T06:15:02.620 回答