从has no method 'tmpl'谈起

最近做一个相对比较功能专业化的应用系统，其中今天Leader提出的功能修改需求有点smart table的意思，其中有个界面修改由于用Dom操作太麻烦了，于是想用用很久之前在学习jQuery API中看到的js模板，这个东东好像目前在一些JS MVC实现中很流行。

1、第一次看到"has no method 'tmpl'"这个提示,G了一下，结果第一个结果英文帖子说tmpl不属于jquery的核心内容，属于插件，需要另外下载jquery-tmpl插件，据说这是微软贡献的开源插件，host在github上，下载地址：https://github.com/jquery/jquery-tmpl

2、把上面那个插件的min.js加载上，仍然函数不存在的提示，开始的时候以为是函数的调用方式有问题，于是采用插件文档中的Demo写法，仍然提示函数不存在，后来动脑袋想了想，发现了其中问题：由于我目前开发的模块和网站整体的JS引用存在区别，所以目前模块的JS引用没有写在foot.jsp里，而是写在side.jsp里面，有些mainContent页面里面的JS代码存在对库的依赖问题，于是在mainContent前面部分，可能会重复地放某些JS库文件，比如此处的jQuery.min.js，而我的tmpl.min.js由于只在这个页面内用一下，于是放在mainContent.jsp中jquery.js引用的后面，而我的页面整体布局采用的固定布局方式，sidebar虽然在mainContent的左面，但是采用负值maring-left的布局方式，side.jsp文件代码实际页面中是在mainContent的后面，导致我的tmpl.js实际是在两个jquery.js的中间，tmpl给$对象添加的tmpl函数，在后面那个jQuery中又被重置了，所以找不到啊。Ok,这个提示的问题就此解决。同时稍微深入谈一下JS加载依赖这个问题，其实如果所有JS里面的函数都暴露在全局，不存在调用某个对象的函数属性问题的话，前前后后都无所谓，因为是平行的，而且执行都是加载完的事件引发，依赖的是那部分，依赖的其实是那些在函数外面的代码，也就是那部分在加载的时候就要执行的代码，这些代码之间才存在真正的依赖关系：也就是后面执行的代码要依靠前面代码的执行结果，这和静态语言比如C之类的include是有区别的，C的include解决的是语言编译时的引用依赖，而JS中的依赖实际是执行关系的依赖，说白了：后面的代码用到了前面代码的计算结果，而不是仅仅那么一个引用标记。

3、前面那个问题算是解决了，下面讲讲其他几个今天碰到的JS问题，先将讲dblclick事件的绑定问题，白天在单位做的，那个时间CSDN博客访问有问题，晚上回家写，代码也不在身边，可能细节上不太全，有兴趣的人凑活看吧，第一次实现的时候，用的就是最基本的方法，用元素on属性解决的，我在Chrome下做的测试，结果上线以后，IE下基本无效，G了一下，发现IE和其他浏览器在这事件上语法不一样，于是乎用jQuery的dblclick()方法绑定事件函数解决跨浏览器兼容问题，结果还发现另外一个问题，由于事件冒泡模型的区别，之前的事件处理函数在某些情况下会出现设定外的意外处理情况，于是乎用event.stopPropagation();解决了这个问题。

4、在后续的另外一个blur事件处理函数中，采用元素on属性方式下，在IE中，jQuery语法的的event对象好像无效，event.target是个null,由于这个事件函数的target是动态添加的，于是用jQuery的live函数做了事件绑定处理，解决了event无效的问题，后来想了想，可能jQuery的event跨浏览器兼容要想生效，可能必须得用它的函数做事件绑定，否则它的阔浏览器处理可能插不进来。具体估计得看它的代码才能确认。

5、button元素的Type属性的默认值问题，昨天碰到预设的普通button在点击之后，不但激发了click事件，在事件处理之后还自动提交了表单，好像之前碰到过这个问题，当时只是解决了，没有思考问题原因，昨天我觉得可能是前面说的问题，但是只是加了明文的type属性，没有做确认，今天写了段代码试了一下，果然是啊，button元素在IE里面的默认Type属性值是button,在Chrome和Firefox里面的默认属性值是submit。所以用这个元素的时候，最好还是写明其Type属性值。