1

给定一个标准的 html 表单，如下所示；

<form method="post" action=<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>>
                            <div class="row half">
                                <div class="6u"><input type="text" placeholder="Name" name="name" /></div>
                                <div class="6u"><input type="text" placeholder="Email" name="email" /></div>
                            </div>
                            <div class="row half">
                                <div class="12u"><textarea name="message" placeholder="Message" name="message"></textarea></div>
                            </div>
                            <div class="row">
                                <div class="12u">
                                    <ul class="actions">
                                        <li><input type="submit" class="button" value="Send Message" name="submit" /></li>
                                        <li><input type="reset" class="button alt" value="Clear Form" name="clear"/></li>
                                    </ul>
                                </div>
                            </div>
                        </form>

和下面的 php

if(isset($_POST['submit'])){
    $to = "enquiries@appcloudkent.com"; // this is your Email address
    $from = $_POST['email']; // this is the sender's Email address
    $name = $_POST['name'];
    $subject = "Website Enquiry";
    $message = $name . " wrote the following:" . "\n\n" . $_POST['message'];
    $headers = "From:" . $from;
    $headers2 = "From:" . $to;

    if(isValidString($from) && isValidString($name) && isValidString($message)){
        mail($to,$subject,$message,$headers);
    }
}

可以发送电子邮件，但是，这种方法会导致一些问题。因为我的表单位于页面底部，所以当单击发送时，页面被重定向回来，焦点回到页面顶部。

提供足够的用户反馈以让用户知道电子邮件已发送的正确方法是什么，是否可以导航回页面并自动滚动到底部 - 允许我将发送按钮更改为绿色或其他什么？

如果做不到这一点，是否有更好的方法来做到这一点？

谢谢

4

3 回答 3

4

在表单前添加锚链接。 <a id="anchorName"></a>

将您的表格发布到锚点。

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>#anchorName">

于 2014-10-02T08:45:56.573 回答
0

表单操作应该指向页面本身（就像它在您的示例中所做的那样），以便您可以显示来自验证的错误消息（就像您没有那样）。

如果表单不在页面顶部，您可以添加锚点：

<h2><a name="theForm">The form</a></h2>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>#theForm">

如果表单处理正确（=发送邮件），最好重定向到另一个页面，显示成功消息。所以按 F5 不会再次提交表单（并发送另一封邮件）。

if (mail($to,$subject,$message,$headers)) {
    // redirect to page showing success message and exit script
} else {
    // redirect to page showing error message and exit script
}

我通常会再次重定向到同一页面，但附加一个参数 ( $_SERVER["PHP_SELF"].'?mail_success=1')，然后在模板中我决定是否显示成功消息、错误消息或表单：

if (isset($_REQUEST['mail_success'])) {
    // show success message
} elseif (isset($_REQUEST['mail_error'])) {
    // show error message, technical issues, try again bla bla
} else {
    // show the form (including validation errors if necessary)
}
于 2014-10-02T08:59:26.240 回答
0

您可以使用 XMLHttpRequest 提交表单，并取消按提交的默认操作。jQuery 的 .post() 和 event.preventDefault() 方法在这方面特别擅长。

于 2014-10-02T08:57:19.433 回答