php - PHP 电子邮件表单中的 anchor 标记

Question

你能帮助任何人吗？

我用 PHP 制作了一个邮件表单。此表格一直位于页面底部。当我点击发送(这是一个输入标签)时，如果有错误，它会显示在表单上方。

但是当您点击发送时，页面将首先回到顶部，您必须一直向下滚动才能查看是否有任何错误。

那么有没有可能让页面从一开始就跳回呢？

我知道它已经解决了很多次，例如这里Is it possible not to jump to the top of the page on form submit?但附上这段代码，它仍然会在投资组合部分的联系部分上方滚动……我的页面 svejdamartin.com你有什么想法吗？

<footer>
  <section id="contact">                   
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <div id="fourth">
          <h1>Contact Form</h1>
          <p>Please, do not hesitate to contact me if you want to get more information.</p>
           <?php
             if (isset($_GET['sent']) === true) { // ne POST ale GET //
               echo '<div class="alert alert-success" role="alert">Thank you, I will be in touch</div>'; // toto se vypise po odeslani vzkazu //

             } else {  //tento tag konci az na konci formulare !!! Otevrel jsem tam php a ukoncil tento else //
               if (empty ($errors) === false) { // tohle php vypisuje upozornovaci hlasky primo nad formularem //
                 echo '<ul>';
                 foreach($errors as $error) {
                   echo '<li>', $error, '</li>';            
                 }
                 echo '</ul>';
               }           
             ?>
             <form id="form-anchor" method="post" action="index.php#form-anchor">
               <div class="form-group">
                 <input type="text" name="name" class="form-control" placeholder="Your name" <?php if (isset($_POST['name']) === true) { echo 'value="', strip_tags($_POST['name']), '"'; } ?>>                                       
               </div>
               <div class="form-group">
                 <input type="email" name="email" class="form-control" placeholder="Your email" <?php if (isset($_POST['email']) === true) { echo 'value="', strip_tags($_POST['email']), '"'; } ?>>                                       
               </div>                                                                        
               <div class="form-group">
                 <textarea name="message" rows="5" class="form-control" placeholder="message...."><?php if (isset($_POST['message']) === true) { echo strip_tags($_POST['message']); } ?></textarea>                                       
               </div>
               <div class="checkbox">
                 <label>
                   <input type="checkbox" name="check">I am human
                 </label>
               </div>
               <input type="submit" name="submit" class="btn btn-secondary" value="send message">                                   
             </form>
             <?php
             }
           ?>
         </div>    
       </div>
     </div>
  </section>
</footer>

Answer 1

页面在投资组合部分而不是联系人部分结束的原因是浏览器在加载投资组合中的图像之前查找 #fourth anchor 。

因此，浏览器正确定位了页面，但随后由于动画，联系表单向下移动。

解决此问题的一种方法是定义 #imag div 的高度，使其已经是图像的大小。