Предотвратить перезагрузку страницы и перенаправить на форму отправить ajax / jquery

Я просмотрел все подобные посты, но ничего не помогло. Это то, что у меня есть

HTML:
<section>
  <form id="contact-form" action="" method="post">
    <fieldset>
      <input id="name" name="name" placeholder="Name" type="text" />
      <input id="email" name="email" placeholder="Email" type="text" />
      <textarea id="comments" name="comments" placeholder="Message"></textarea>
      <div class="12u">
        <a href="#" id="form-button-submit " class="button" onClick="sendForm()">Send Message</a>
        <a href="#" id="form-button-clear" class="button" onClick="document.getElementById('contact-form').reset()">Clear Form</a>
      </div>
      <ul id="response"></ul>
    </fieldset>
  </form>
</section>
JavaScript / JQuery:
function sendForm() {
  var name = $('input#name').val();
  var email = $('input#email').val();
  var comments = $('textarea#comments').val();
  var formData = 'name=' + name + '&email=' + email + '&comments=' + comments;
  $.ajax({
    type: 'post',
    url: 'js/sendEmail.php',
    data: formData,
    success: function(results) {
      $('ul#response').html(results);
    }
  }); // end ajax
}

Что я не могу сделать, это предотвратить обновление страницы, когда#form-button-submit нажата. Я старалсяreturn false; Я старалсяpreventDefault() и каждая комбинация, включаяreturn false; внутриonClick, Я также пытался использоватьinput type="button" а такжеtype="submit" вместо этого и тот же результат. Я не могу решить это, и это сводит с ума. Если это вообще возможно, я бы предпочел использовать гиперссылку из-за некоторых дизайнерских вещей. Буду очень признателен за вашу помощь в этом.

Ответы на вопрос(7)

Ваш ответ на вопрос