javascript - 如何将 "oninput"添加到 html 表单标签，通过 id 定位标签而不是编辑表单标签本身

Question

我想使用我在网上找到的代码 http://jsfiddle.net/2GhQX/在我的联系表单中，以便实时显示范围 slider 值，但是，我的表单是使用 wordpress 插件创建的，因此我无法将任何 javascript 添加到 <form>标签。该插件确实允许我将 id 和类添加到表单标记(插件:contactform7)。

有没有办法添加oninput="amount.value=rangeInput.value"到<form>标签，而不通过使用 id 或类来定位该表单来编辑表单标签本身？

我对 javascript 知之甚少，所以我会感谢您的帮助。

所以而不是

<form oninput="amount.value=rangeInput.value">

我希望我的表单标签看起来像这样:

<form id="myform">

然后使用 javascript 将 oninput 添加到通过表单 ID 定位的标签

Answer 1

您可以使用document.getElementById()方法来访问表单:

var myForm = document.getElementById('my-form-id');
myForm.addEventListener('input

var theForm = document.getElementById('theform');
theForm.addEventListener('input', function(){
  alert('hi');  
});

<form id="theform">
  
  <input />
  
</form>