其实这个问题,昨天已经遇到过,可是昨天是公司的一枚老员工帮助我这个实习生调的,并且我也确(猜)定(测)那枚老员工也不知道这个区别。而后今天又遇到相同问题。css
如今公司里面作一个项目,用到AngularJs框架,个人老大给了我一个接口服务,给我去调用和测试,我部署完项目的包在本地tomcat服务器后,开始写前端的代码,从html到css到JavaScript(用的少)到bootstrap,好。如今前端的静态界面搭出来了。而后用老大给的接口服务去测试,angularJS的是一个MVVM框架,典型就是双向绑定,而后写完相关逻辑代码后,每次界面都会无厘头的跳到本身,我看个人代码中,若是response返回的是true的话,应该是跳到order界面,而false的话是跳到login界面,总之就是不跳到本身,真是怪了!而后我打开chrome的开发者工具,发现每次都不走写的Angular的函数里。后来,检查出ng-model没问题,而后发现input的type是submit,我尝试改为button,哎哟喂,尽然一切都ok了。这让我百思不得其解,遂写这个随笔,找出事情真相。html
整体上:有input和button都能当按钮使用,都能把数据提交到后端供后端处理。前端
不一样点:①input本是输入,可是type="submit"后,也起到提交的做用,因此 input 是提交表单chrome
<input type="submit" value="提交">
②button是按钮,他是纯的按钮,若是不在按钮上加上操做,点击没有任何反应,只有加上相似type="submit" onclick="xxx()"才能起到按钮提交的做用。bootstrap
<button type="submit">肯定</button>
因此,按照软件设计模式的大原则---单一职责原则,建议用button来做为按钮,而少用input做为提交按钮,input按钮应该做为数据的输入来使用。后端
以上内容来自一个实习生学习前端的感悟。不当之处,还请看客能指出,并在此多谢!设计模式