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了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 之前在Sencha Cmd创建Ext JS示例项目演示了用Sencha Cmd来创建一个Login示例。在这里会演...
    写意悠悠阅读 8,930评论 4 24
  • 22年12月更新:个人网站关停,如果仍旧对旧教程有兴趣参考 Github 的markdown内容[https://...
    tangyefei阅读 35,237评论 22 257
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,814评论 1 92
  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 6,554评论 0 17
  • 土地里蜷缩的遒劲的生长的父亲 深夜里对我说 对爱情要相信 我惨淡的微笑消失在密不透风的黑夜里 像吹落花瓣的最轻的风...
    ForeverFalling阅读 555评论 2 1