javascript - 使用JS从表单中获取所有输入ID

Question

我创建了 2 个函数：第一个函数旨在构建一个 HTML 表格，它不是基于 JSON，而是基于搜索表单的输入。在这个阶段我只想从表单中检索信息并制作一个简单的 console.log

const showResultsHTML = resultRequest => {
    const pageFormElements = getAllFormElements(document.getElementById("requestForm"));

    console.log(pageFormElements);

}

我的第二个功能是浏览表单并从表单中提取 tag.id（输入 id、选择 id 等）。在调试应用程序或制作简单的 console.log 标记值时符合我的期望。

const getAllFormElements = element => {
    Array.from(element.elements).filter(
        tag => {
            ["select", "textarea", "input"].includes(tag.id);
        }
    )
}

当我尝试在 showResultsHTML 函数的控制台中显示结果时，它返回未定义。

标签： javascript

Answer 1

您没有从getAllFormElements. 您的过滤器中存在同样的问题 - 您忘记了return.

const getAllFormElements = element => {
    return Array.from(element.elements).filter(
        tag => {
            return ["select", "textarea", "input"].includes(tag.id);
        }
    )
}

或删除花括号以进行隐式返回

const getAllFormElements = element => 
    Array.from(element.elements).filter(
        tag => ["select", "textarea", "input"].includes(tag.id)
    )

const showResultsHTML = resultRequest => {

    const pageFormElements = getAllFormElements(document.getElementById("requestForm"));

    console.log(pageFormElements);
}


const getAllFormElements = element =>  Array.from(element.elements).filter(
        tag =>  ["select", "textarea", "input"].includes(tag.id)
    )


showResultsHTML();

<form id="requestForm">
  <select id="select"></select>
  <textarea id="textarea"></textarea>
  <input id="input">
</form>