如何用js提交form表单

<form id="myForm" action="/submit-form" method="post">
  <input type="text" name="username" />
  <input type="password" name="password" />
  <button type="button" onclick="submitForm()">Submit</button>
</form>

<script>
function submitForm() {
  document.getElementById('myForm').submit();
}
</script>

function sendFormData() {
  var form = document.getElementById('myForm');
  var formData = new FormData(form);

  var xhr = new XMLHttpRequest();
  xhr.open(form.method, form.action, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      // 处理响应
      console.log(xhr.responseText);
    }
  };
  xhr.send(formData);
}

async function submitFormWithFetch() {
  var form = document.getElementById('myForm');
  var formData = new FormData(form);

  try {
    const response = await fetch(form.action, {
      method: form.method,
      body: formData
    });
    if (response.ok) {
      const data = await response.json(); // 或者 response.text() 根据服务器返回的数据类型
      // 处理响应数据
      console.log(data);
    } else {
      // 处理错误情况
      console.error('Error:', response.status);
    }
  } catch (error) {
    // 处理网络错误
    console.error('Fetch error:', error);
  }
}

document.getElementById('myForm').addEventListener('submit', function(event) {
  event.preventDefault(); // 阻止表单默认提交行为

  // 这里可以使用上面的Fetch API或者XMLHttpRequest来提交数据
  submitFormWithFetch();
});