前端点击按钮提交输入的手机号码，验证手机号码输入格式是否正确后，在接口提交输入的手机号

好的，您的问题是如何实现前端验证手机号码格式并提交到后端接口。首先，您可以在前端使用正则表达式来验证手机号码格式是否正确。以下是一个示例：

function validatePhoneNumber(phoneNumber) {
  const regex = /^1[3456789]\d{9}$/;
  return regex.test(phoneNumber);
}

这个函数接收一个参数 `phoneNumber`，然后使用正则表达式验证手机号码格式是否正确。如果格式正确，返回 true，否则返回 false。

接下来，在用户点击提交按钮时，您可以调用这个函数来验证手机号码格式是否正确。如果格式正确，您可以使用 AJAX 或 fetch API 将手机号码提交到后端接口。

以下是一个示例：

const phoneNumberInput = document.getElementById('phone-number');
const submitButton = document.getElementById('submit-button');

submitButton.addEventListener('click', () => {
  const phoneNumber = phoneNumberInput.value;
  if (validatePhoneNumber(phoneNumber)) {
    fetch('/api/submit-phone-number', {
      method: 'POST',
      body: JSON.stringify({ phoneNumber }),
      headers: {
        'Content-Type': 'application/json'
      }
    })
      .then(response => response.json())
      .then(data => console.log(data))
      .catch(error => console.error(error));
  } else {
    alert('请输入正确的手机号码！');
  }
});

在这个示例中，我们首先获取输入框中的手机号码，然后调用 `validatePhoneNumber` 函数来验证手机号码格式是否正确。如果格式正确，我们使用 fetch API 将手机号码提交到后端接口 `/api/submit-phone-number`。我们使用 POST 方法提交数据，将手机号码包装成一个 JSON 对象并设置请求头的 Content-Type 为 application/json。在提交成功后，我们可以通过 `response.json()` 方法获取后端返回的数据，并进行处理。如果提交失败，则会在控制台输出错误信息。如果手机号码格式不正确，则会弹出一个提示框提示用户输入正确的手机号码。

希望这个示例能够帮助您解决问题。