javascript 如何检查页面中的所有输入是否为空

vhmi4jdf  于 2023-08-02  发布在  Java
关注(0)|答案(1)|浏览(107)

目前我的页面上有6个输入。如果它们都不为空,则应设置inputsCheckState = true。
但实际情况是,如果只有一个输入不为空,我的代码将设置inputsCheckState = true。
如何修复此bug?
这是我目前的代码:

inputs.forEach(e => {
            if (e.required && e.value.length === 0) {
                console.log(e.value.length)
                if (message === null) {
                    doneMessage('../../../../assets/images/alarm.svg', 'برجاء ملئ جميع الحقول المطلوبه', '', 'حسناً')
                    inputsCheckState = false
                }
            } else if (e.required && e.value.length !== 0) {
                inputsCheckState = true
            }
        });

字符串

64jmpszr

64jmpszr1#

您可以将inputs节点列表强制转换为数组,以便可以使用every数组方法。
every()方法测试数组中的所有元素是否都通过了所提供函数实现的测试。它返回一个布尔值。

const inputs = document.querySelectorAll('input');
const button = document.querySelector('button');
button.addEventListener('click', handleClick);

function doneMessage(msg) {
  console.log(msg);
}

function handleClick() {

  const inputsCheckState = [...inputs].every(input => {
    return input.required && input.value.length;
  });

  if (!inputsCheckState) {
    doneMessage('Input(s) not complete');
  } else {
    console.log('Inputs complete');
  }

}

个字符

相关问题