有关form表单的button事件

今天要实现一个功能,遇到一个坑,自己折腾了很久,记录一下以提醒自己以及他人。代码如下:

当我在button上面绑定事件的时候,始终不能成功。查错的时候一直以为是自己的js有误,就在那里不停的调js,然后一直查不出原因,请教同事,也是查不出js的原因,突然我对同事说,会不会是我的HTML有问题。然后我们就来查HTML,最开始也是没有发现什么问题,然后我就说我把button移个位置试试,结果位置变化后,button绑定事件居然成功了。反复移动位置之后,终于发现,居然是form的原因,当form标签包裹button之后,就获取不到button的绑定事件了。form一般是表单,但是我在这里使用并不是为了创建表单,而是使用form来包裹整个部分。获取不到绑定事件因为点击了button之后,页面会执行form的action,也就是自动提交表单。为了让页面执行button绑定的事件,需要在form中增加 onSubmit="return false;"或者将button的type=“button”属性,或者是form中的 。最简单的方法是,button标签尽量少和form一起使用。

你可能感兴趣的:(有关form表单的button事件)