Ajax Comment: Page reloads whenever the comment submission form is reloaded

Question

I noticed that when I'm trying to comment too fast in a page it's getting reloaded. I want to avoid reloading the whole page just because someone submits comments too quickly but I don't know where to start.

BTW, here's the ajax script I'm using. Since I'm really new on ajax and jQuery, I haven't been able to figure how to avoid the said issue, or if the said issue is in my ajax script. I'm also using underscores theme if that info would be relevant.

---

EDIT: I did some trial and error and noticed stuffs, changing the title for a more accurate description as well.

1. The reload problem don't happen when posting comments in rapid succession.
2. Submitting a comment for the first time reloads all contents under #comment element, and the reloading issue is starting when using the form inside the reloaded #comment element, e.g. when trying to comment on a second time.

Answer 1

I found out the issue. It was something like jQuery/AJAX code for it is not being able to hook itself when I reload the form with .load(), therefore the second time I submit a new comment, or when I clicked the reload button for the comment list/form (making the .load() run once), the new form would still submit the comment but since the jQuery/AJAX is not being run, the page reloads normally without AJAX.

I just changed the code from this:

$('#commentform').submit(function() {
  .....
}

to this:

$(document).on('submit', '#commentform', function() {
  .....
}

I'm glad that I've been able to pinpoit the issue, even if it took a long search and carefully selecting my search keywords on google.