Webpage vanishes when clicking button to send data to server with jQuery

I am having a issue with HTML and jQuery programming. I am making a bulletin board with HTML and jQuery, with 2 textboxes and a button.

$(document).ready(function(e) {
  $('save').click(function() {
    const name = $('name').val();
    const words = $('words').val();
    $.post(
      "http://localhost:8000/board_write",
      {
        name: words
      },
      function(data, status) {

      }
    )
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="0">
  <tr>
    <td class="vert" bgcolor="">
      Name
    </td>
    <td>
      <input class="name">
    </td>
  </tr>
  <tr>
    <td bgcolor="">
      Anything you'd like to say
    </td>
    <td>
      <textarea class="words" cols="40" rows="5" placeholder="please enter anything">
    </textarea>
    </td>
  </tr>
  <tr>
    <td>
      <input class="save" type="button" onclick="write()" value="Save">
    </td>
  </tr>
</table>

And, I also coded with jQuery to send the data of the two textboxes to localhost:8000, which is a node.js server to log the data to the console. When I click the button, the page vanishes. What causes the situation? And, how can I solve the problem?

Answer

You have onclick = "document.write()"; that explicitly deletes the document . https://www.w3schools.com/jsref/met_doc_write.asp

Explanation: the code in onclick is scoped such: {window{document{element{}}}}; if you meant to implement a write() function, do so and invoke it by window.write(), or name it something differently to document.write. Otherwise, write() will de resolved to document.write().