愿所有的美好和期待都能如约而至

如何在表单元素上使用映射方法

发布时间:  来源:互联网  作者:匿名  标签:arrays dictionary element error How to use a map method on form elements excepti  热度:37.5℃

本文介绍了如何在表单元素上使用映射方法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想创建一个表单元素的所有名称的列表。
但是,使用以下代码时,我得到了错误:
“inputs.map不是函数”

我知道inputs不是数组,但我不确定如何使This.map起作用?

数据-lang=”js”数据-隐藏=”假”数据-控制台=”真”数据-巴贝尔=”假”>

function process(form) {
  console.dir(form)
  var inputs = form.elements
  for (let i = 0; i < inputs.length; i++) {
    console.log(i+':'+inputs[i].name+': '+inputs[i].value);
  }
  let names = inputs.map( e => e.name )

  console.log(names)
  
}
<form name=form1 method=none>
firstname: <input name=lastn value="a" type=text>
<br>lastname: <input name=firstn value="b" type=text>
<br>zipcode: <input name=zip value="c" type=text>
<br>ip: <input name=ip value="127.0.0.1" type=text disabled>
<br><input onclick="process(this.parentNode)" name=button type=button value="register">
</form>

btw要运行代码,您必须单击”注册”按钮(因为这是一个”onClick”调用)

推荐答案

HTMLFormElement.elements是一个HTMLFormControlsCollection,它是一个类似数组的对象,而不是一个实际的数组。使用Array.from()将其转换为数组:

数据-lang=”js”数据-隐藏=”假”数据-控制台=”真”数据-巴贝尔=”假”>

function process(form) {
  var inputs = Array.from(form.elements)

  const names = inputs.map(e => e.name)

  console.log(names)
}
<form name=form1 method=none>
  firstname: <input name=lastn value="a" type=text>
  <br>lastname: <input name=firstn value="b" type=text>
  <br>zipcode: <input name=zip value="c" type=text>
  <br>ip: <input name=ip value="127.0.0.1" type=text disabled>
  <br><input onclick="process(this.parentNode)" name=button type=button value="register">
</form>

这篇关于如何在表单元素上使用映射方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,

勇敢去编程!

勇敢的热爱编程,未来的你一定会大放异彩,未来的生活一定会因编程更好!

TOP