js判断所有表单项不为空则提交表单的实现方法

下面是实现方法的完整攻略：

一、获取表单元素

在提交表单前，我们首先需要获取表单里的所有输入元素的值，然后进行判断。可以使用以下方法获取表单元素：

const input_elements = document.querySelectorAll('input[required]');

上面的代码调用了 querySelectorAll()方法，选择了所有带有 required 属性的 input 元素，并将其保存在 input_elements 变量中。

二、循环判断表单元素

接下来，我们需要对 input_elements 中的每一个元素进行判断，判断其值是否为空。可以使用以下方法循环遍历每一个表单元素：

let form_filled = true;
for (let i = 0; i < input_elements.length; i++) {
  if (input_elements[i].value === '') {
    form_filled = false;
    break;
  }
}

在上面的代码中，我们定义了一个变量 form_filled 来标识表单是否填写完整。然后使用 for 循环遍历了 input_elements 中的每一个元素，并判断其值是否为空。如果存在任何一个值为空，就将 form_filled 标识设置为 false，并退出循环。

三、提交表单

最后，我们需要在判断表单元素的值都不为空的情况下，提交整个表单。可以使用以下方法提交表单：

if (form_filled) {
  document.querySelector('form').submit();
}

在上面的代码中，我们首先判断 form_filled 变量是否为 true，即表单元素是否填写完整。如果是，则获取 form 元素并调用 submit() 方法提交表单。

示例说明

接下来，我们使用两个实例来解释这个实现方法：

1. 在一个注册页面中，用户需要填写用户名、密码和邮箱才能注册。在提交表单前，我们可以使用上述代码获取这三个输入框的值，然后判断他们是否为空。如果都填写了，就可以提交表单，让用户完成注册流程。

2. 在一个评论页面中，用户可以输入评论内容进行回复。为了防止用户忘记填写评论内容，我们可以使用上述代码获取评论输入框的值，然后判断它是否为空。如果为空，就阻止用户提交表单，并提示用户输入评论内容。只有评论内容不为空，才能成功提交评论。