问我找到了一种不用后端使用Formspree从网站直接发送电子邮件的方法。但是，我不知道如何自定义提交的消息

EN

var form = document.getElementById("my-form");

async function handleSubmit(event) {
    event.preventDefault();
    var status = document.getElementById("status");
    var data = new FormData(event.target);
    fetch(event.target.action, {
    method: form.method,
    body: data,
    headers: {
        'Accept': 'application/json'
    }
    }).then(response => {
    status.innerHTML = "Thank you, received submission!";
    form.reset()
    }).catch(error => {
    status.innerHTML = "Oops! There was a problem submitting your form"
    });
}
form.addEventListener("submit", handleSubmit)

.contact-form{
  width: 500px;
  height: 600px;
  color: white;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin-bottom: 100px;
  display: flex;
  flex-direction: column;
  
}
form{
  margin: 35px;
  margin-left: 50px;
}

.input-field{
  width: 400px;
  height: 40px;
  margin-top: 40px;
  padding-left: 10px;
  padding-right: 10px;
  border:  1px solid #c4c4c4;
  border-radius: 9px;
  outline: none;
}

.text-area{
  height: 150px;
}
.submit{
  border-radius: 40px;
 border: none;
 background-color: var(--primary-color);
  color: #FFF;
  width: 250px;
  height: 50px;
  margin:  20px 80px;
  cursor: pointer;
  font-weight: bold;
  transition: 1s ease;

}
.submit:hover{
  background-color: #FFF;
  color: var(--primary-color);
  box-shadow: var(--box-shadow);
}
#status{
  width: 300px;
  max-width: 300px;
  height: 50px;
  max-height: 90px;
  margin: -50px 100px;
  text-align: center;
  font-weight: bold;

}
#status.success{
  color: var(--primary-color);
  animation: status 4s ease forwards;
}

#status.error{
  color: var(--primary-color);
  animation: status 4s ease forwards;
}

@keyframes status{
  0%{
    opacity: 1;
    pointer-events: all; 
  }
  90%{
    opacity: 1;
    pointer-events: all; 
  }
  100%{
    opacity: 0;
    pointer-events: none; 
  }
}

            <div class="contact-form mx-auto">
              <form action="https://formspree.io/f/xeqnqkve" id="my-form" method="POST">
                <label for="Name">
                  <input type="text" class="input-field" id="yourname" name="Name" placeholder="Your Name">
                </label>
                <label for="Email">
                  <input type="text" class="input-field" id="youremail" name="Email" placeholder="Your Email">
                </label>
                <label for="Subject">
                  <input type="text" class="input-field" id="subject" name="Subject" placeholder="Subject">
                </label>
                <label for="Message">
                  <textarea type="text" class="input-field text-area" placeholder="Message" name="message" id="message"></textarea>
                </label>
                <button type="submit" class="submit">Send Message</button>
              </form>
              <div id="status" class="success">Thank you!</div>
              
                
                
            </div>

<script>
    var form = document.getElementById("my-form");
    
    async function handleSubmit(event) {
      event.preventDefault();
      var status = document.getElementById("my-form-status");
      var data = new FormData(event.target);
      fetch(event.target.action, {
        method: form.method,
        body: data,
        headers: {
            'Accept': 'application/json'
        }
      }).then(response => {
        status.innerHTML = "Thanks for your submission!";
        form.reset()
      }).catch(error => {
        status.innerHTML = "Oops! There was a problem submitting your form"
      });
    }
    form.addEventListener("submit", handleSubmit)
</script>