MVC js加载两遍

近期在项目开发过程中遇到的页面加载小问题在这里简单的总结一下。

1.点击按钮使用异步加载的方法去查询列表内容的时候，我发现执行了两遍。反复查看代码都没有找到原因。页面中代码如下所示：

 <form class="panel panel-default">
       <div class="panel-heading">
              列表
        </div>
         <div class="row wrapper">
               <div class="form-inline" role="form">
                     <div class="fr "  id="search">
                           <button class="btn btn-success"><i class="fa fa-search"></i>查询</button>
                     </div>
              </div>
         </div>
   </form>

按钮使用的button，而不是<input type='button' />这种形式，后来我就换了这种形式，发现结果就对了且是执行一遍。后来经过大牛一看，说原因肯定不是出在这里了。后来就反复再检查代码，最终是把最外层的form改成div，结果就对了。

由此总结，如果页面添加的是form表单，标签内部如果再使用button标签，则页面会把button自动识别为submit类型去执行。因为submit执行一次，button点击事件又执行一次。这才是最终原因。所以我们在写代码的过程中一定要记得把form表单和button标签区分开来。

2.js生命周期

控制器中主页面和副页面我们一般会使用一个js文件去处理所有逻辑，最开始我不清楚执行顺序，我再每个页面中都去引用这个js文件，这个时候你会发现副页面的方法都会执行两遍。而实际是只要在主页面中引用一次js文件就ok了。