Question

我是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即可。知道为什么吗？

Answer 1

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

为了调用它，请尝试：

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

区别在于“父”告诉JS在框架的父级中查找函数;）

请确保所有内容/端口位于同一域/端口，否则您可能违反同源策略，因此可能无效。

修改

这是一个在我的机器上运行正常的配置（PHP5，Firefox）：

的test.html

<html> <head> <script type="text/javascript">  </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>

email.php：

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

Answer 2

表单页面中的所有内容都将在下一页上删除。所以不再有thanksDiv功能了。当您提交表单时，您将完全转到另一页。

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

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

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

将重定向到成功页面。

Answer 3

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

在第二行中缺少。

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

此功能应该在email.php中。或者添加一个单独的页面并在那里包含页面。

Answer 4

点击发送短信电话

onclick="thanksDiv();";

php回显javascript调用

4 个答案: