获取每个表单的 ID 属性

如何解决获取每个表单的 ID 属性

我需要在单击时控制台每个表单元素的日志 ID 属性。所以如果有人没有点击表单元素，我不想控制台记录它。

这是我的代码：

<form class="cf">
  <div class="half left cf">
    <input type="text" id="input-name" placeholder="Name">
    <input type="email" id="input-email" placeholder="Email address">
    <input type="text" id="input-subject" placeholder="Subject">
  </div>
  <div class="half right cf">
    <textarea name="message" type="text" id="input-message" placeholder="Message"></textarea>
  </div>  
  <input type="submit" value="Submit" id="input-submit">
</form>

我试过了：

document.addEventListener('click',function(e) {
console.log(e.target.id);
},false);

它确实有控制台日志，但一切都在点击，我只需要点击每个表单的 ID 属性。

解决方法

您只需在表单中添加一个单击侦听器事件即可。
示例：

let forms = document.querySelectorAll('form');

function formClicked(event) {
    console.log(event.target.id);
}

forms.forEach(form => {
    form.addEventListener('click',formClicked,false);
});