脚本位于正文中时无法计算addEventListener错误

时间:2018-08-11 19:14:36

标签: javascript html

我正在使用向表单提交AFHTTPSessionManager的提交按钮,但是我陷入了addEventListner的未定义错误。我测试了元素是否为addEventlister并返回true

这是我的表格:

true

这是我的Java脚本:

<form action="POST">
    <input name="name" type="text" autocomplete="given-name">
    <input name="lastname" type="text" autocomplete="given-name">
    <button type="button" id="for_input">Submit</button>
</form>

错误:

  

未捕获的TypeError:无法读取的属性'addEventListener'   未定义

我尝试添加到html正文中,但仍然收到相同的错误。

3 个答案:

答案 0 :(得分:2)

您没有任何元素名称for_input,但是您有一个按钮,其 ID for_input。因此,请使用querySelectorgetElementById方法代替getElementsByName上的document方法。

var el = document.querySelector('#for_input');
if (el) //check if true
  console.log("Value is true");
else
  console.log("Value is false");

//define alert to check click        
var showMe = function () { alert("clicked worked"); };


el.addEventListener("click", showMe, false);

document.getElementsByName('for_input')返回NodeList [],该值已分配给el,因为在name="for_input"对象中找不到document的html元素。稍后当您致电el[0]时,它给了您undefined,因为el的节点列表为空。因此,undefined.addEventListener(..)调用导致您在日志中看到错误。

答案 1 :(得分:1)

您忘记添加名称,您使用的是id =“ for_input”而不是name =“ for_input”。

<button type="button" name="for_input">Submit</button>

答案 2 :(得分:1)

您缺少名称为for_input及其按钮ID的元素,因此请使用getElementById

var el = document.getElementById('for_input');

现在el不是数组,因此不需要像el[0]那样添加数组位置,只需使用el

el.addEventListener("click", showMe, false);