php验证失败后跳转到特定id答案

【问题标题】：jump to specific id after php validation failsphp验证失败后跳转到特定id
【发布时间】：2015-05-16 20:23:22
【问题描述】：

谁能告诉我如何让页面跳转（或滚动）到特定的 id，php 验证失败后出现错误消息的地方？

我有一个很长的 php 页面，用户必须滚动到底部。在页面中间，有一个联系表格，用户可以在其中输入电子邮件地址和评论。用户按下“发送”按钮后，php 验证工作。但是，在按下“发送”按钮后，它会跳转到页面的最顶部。之后，我可以通过自己向下滚动看到显示在联系表下方的错误消息。但是，这不是你们都同意的方式......

然后，我尝试使用 javascript scrollTop，如下所示。 ScrollTop 工作，虽然没有出现错误信息....

我知道我错过了什么，但我不知道我错过了什么......

你能帮帮我吗？

index.php和top.js如下所示；

index.php

<?php

session_start();
if(isset($_POST['sendemail'])){

  $_SESSION['email'] = $_POST['email'];
  $_SESSION['message'] = $_POST['message'];

  if (!$_SESSION['email'] || !filter_var($_SESSION['email'],    FILTER_VALIDATE_EMAIL)) {
    $errEmail = 'please type correct email address';
  }

  if (!$_SESSION['message']) {
    $errMessage = 'please type message';
  }

  if (!$errEmail　&& !$errMessage) {
    header('Location: messagesent.php');
    exit;
  }
}
?>

<html>
  <head>..</head>
  <body>
    ...

   <section id="contact">
    ...
      <div>
        <input name="email" type="text">
        <label>Email</label>
        <?php echo "<p style='color:red;'>$errEmail</p>";?>
      </div>
      <div>
        <textarea name="message"></textarea>
        <label>Message</label>
        <?php echo "<p style='color:red;'>$errMessage</p>";?>
      </div>
      <div class="right-align">
        <button id="contactbutton" type="submit" name="sendemail">Send</button>
      </div>
   ...
  </section>
  ...
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <script type="text/javascript" src="js/top.js"></script>
  </body>
</html>

top.js

$(function(){
  $('#contactbutton').click(function(){
    $('html,body').animate({
      scrollTop: $('#contact').offset().top
    }, 1000);
    return false;
  });
});

【问题讨论】：

标签： javascript php jquery validation scrolltop

【解决方案1】：

假设您有一个包含输入的表单元素，您可以使用片段标识符将表单操作设置为当前页面：

<form action="#errors"> ... </form>

然后您可以为错误容器分配一个 id：

<div id="errors">Error list</div>

或者在错误容器之前放置一个空锚：

<a name="errors"></a>
<div>Error list</div>

name 和 id 值在文档中必须是唯一的。不需要显式重定向。

【讨论】：

【解决方案2】：

也许你可以为你的消息框创建一个 id：

<?php echo "<p id=\"errMessage\" style='color:red;'>$errMessage</p>";?>

然后在您的验证中，您可以执行以下操作：

if (isset($errMessage) && !empty($errMessage)) {
    header("Location: index.php#errMessage");
  }

这会将光标聚焦在错误消息上。您还可以使用相同的技术来更改对文本区域和其他所需字段的关注。

【讨论】：

感谢 mdodong 给我一个建议，我相信你的解决方案也很有效，但是 adrinn 的解决方案对我来说更简单，因为我是编码的初学者......