Question

在联系表单上按下提交按钮时，页面会跳到底部。我认为这是由js引起的。如果您想尝试一下，请按下面的链接，下一次联系，填写表格并按＆＃34; verstuur＆＃34;

http://expertlemmer.nl/PC-laptop-reparatie-Lemmer/

的javascript：

$('form#contactForm button.submit').on('click', function() {

      $('#image-loader').fadeIn();

      var contactFname = $('#contactForm #contactFname').val();
      var contactLname = $('#contactForm #contactLname').val();
      var contactStraat = $('#contactForm #contactStraat').val();
      var contactPostcode = $('#contactForm #contactPostcode').val();
      var contactTel = $('#contactForm #contactTel').val();
      var contactEmail = $('#contactForm #contactEmail').val();
      var contactSubject = $('#contactForm #contactSubject').val();
      var contactMessage = $('#contactForm #contactMessage').val();

      var data = 'contactFname=' + contactFname  + '&contactLname=' + contactLname +
                 '&contactEmail=' + contactEmail + '&contactSubject=' + contactSubject +
                 '&contactStraat=' + contactStraat  + '&contactPostcode=' + contactPostcode  +
                 '&contactTel=' + contactTel  + '&contactMessage=' + contactMessage;

      $.ajax({

        type: "POST",
        url: "inc/sendEmail.php",
        data: data,
        success: function(msg) {

            // Message was sent
            if (msg == 'OK') {
               $('#image-loader').fadeOut();
               $('#message-warning').hide();
               $('#contactForm').fadeOut();
               $('#message-success').fadeIn();
            }
            // There was an error
            else {
               $('#image-loader').fadeOut();
               $('#message-warning').html(msg);
              $('#message-warning').fadeIn();
            }

        }

      });
      return false;
});

Answer 1

你好，我在你的网页上。你正在使用脚本：

$('form#contactForm button.submit').on('click', function() {
   e.preventDefault();
// and so on

问题是，你没有在函数中传递e。你必须像这样使用它：

$('form#contactForm button.submit').on('click', function(e) {
       e.preventDefault();
    // and so on

然后它会阻止表单刷新页面。我只是猜测你想通过ajax发送表单。

Answer 2

您的表单没有＆＃34;行动＆＃34;属性，这意味着它发布到当前URL。当前URL有一个锚点：#contact，这意味着您将直接跳转到联系人部分。

了解当您进入此链接并向下滚动时（滚动，不要点击联系人），您将跳转到评论部分。

http://expertlemmer.nl/PC-laptop-reparatie-Lemmer/#journal

长话短说，在表单上添加操作标记：）

如何防止页面跳到底部？

2 个答案: