随笔分类 - 动人的JavaScript
摘要：jQuery，一行里面，列联动，jQuery思维是给每一行弄个唯一的id。每一行就搞自己。Knockout，每一行就一个对象咯，然后this指针指来指去。 还有就是html模板问题，display:none;一个tr放在html页面里面是行不通，浏览器会自动去掉tr，td。因此要放在javascript语言里面，再append进去。
阅读全文
摘要：1.值更改触发时间更改view后，焦点离开当前dom元素，view-model的值就改变。你可以设置valueUpdate: "afterkeydown"使得view值改变，view-model值立马改变（类似于onkeyup事件）。更改view-model后，view的值立马改变。 2.注意引用传递和值传递值传递，最常见的就是你model类型是string和number，于是你改了model的值，view-model不变。引用传递，最常见的就是Array类型，你的Model类型Array数据，shift()了，你的view-model改变，你的view也改变了。3.sel
阅读全文
摘要：比如，数据库是couchDB，存储的数据是json格式。为了存储，json数据，越简单，越明了越好。于是json传到前台页面， 发现存储的json格式，不适合前台Knockout绑定的json格式。于是出现了，格式转换函数，双向的，存储转绑定，绑定转存储。转换函数如下： functionKoJSONtoCouchJSON(Arg,stringKey){if(ArginstanceofArray){varinputArray=Arg;varoutputArray=[];for(vari=0;i<inputArray.length;i++){outputArray.push(inputArr
阅读全文
摘要：桌面是一个div，叫它桌面div。这种叫法类推，于是还有图标div，功能栏div，app运行div，正在运行的app标签div。布局方面：功能栏div的z-index为3；图标div，app运行div，正在运行的app标签div的z-index为1；桌面div的z-index为0。被点击的app运行div的z-index为2。功能栏div和桌面div是并列关系；桌面div 包含 图标div，app运行div，正在运行的app标签div。图标div，app运行div，正在运行的app标签div并列。基本事件方面 ：图标div，可托拽；鼠标移到图标div，图标div背景色会变；鼠标点击图标div，
阅读全文
摘要：评价UI组件框架，最好从Grid入手，因为Grid通常是最复杂的UI。 wijmoUI的Grid功能比KendoUI多。但是KendoUI对Grid的数据处理比较好，能够取出Grid某一行的数据，不管你修改与否，都是原来绑定的数据。而wijmoUI，不好意思，你不能。但是KendoUI有个不好之处，就是改变了原来的绑定数据结构，会把你原来是数组，改成object。破坏了数据的完整性。
阅读全文
摘要：普通数组，与Knockout数组关联，Knockout数组与select元素关联。于是，你用Knockout内置函数，处理了Knockout数组，普通数组也随着改变，select元素随着改变。你改变了select元素，Knockout数组随着改变，普通数组随着改变。你通过内置函数改变了普通数组，Knockout数组改变， select元素改变。这就是MVVM，普通数组是Model，Knockout数组是View-Model，select元素是View。但是，你重新绑定了，就另当别论了。 <!DOCTYPEhtml><html><head><script
阅读全文
摘要：Knockout的模板绑定，模版可以用来方便构建复杂的HTML界面，比如拥有嵌套结构的HTML代码页面。Knockout有两种方式使用模板：1.Knockout自带的模板引擎。2.第三方的模版引擎，比如jQuery.tmpl Knockout自带模版引擎的参数列表：data-bind="template: { name: 'person-template', data/foreach: buyer,afterRender/afterAdd/beforeRemove}"name参数就是所对应你定义的模板id，data参数就是你的模板数据源，指向一个js对象；f
阅读全文
摘要：functionfact_iter(product,counter,max_count){if(counter>max_count){returnproduct;}else{fact_iter(counter*product,counter+1,max_count);}//returneval((counter>max_count)?temp=product:fact_iter(counter*product,counter+1,max_count));}alert(fact_iter(1,1,6));这样的代码返回的是undefined。但是改写成函数式写法，就正确返回6!的值了
阅读全文
摘要：function a(){ var i=0; function b(){ alert(++i);//语法解析结果，函数名字b，函数参数列表为空，函数内容alert(++i),函数外部调用列表i。语法执行阶段，发现i不存在当前ScriptObject的函数参数，以及声明变量列表里面，与是就查看函数调用的外部变量列表，存在，保存i的值到闭包。第二次语法解析这个函数，ScriptObject表不重置。 } return b;} var c = a(); c(); c();//第二次语法解析 c();//第三次语法解析 //没有引用，垃圾回收器开始回收b所在的闭包。//JavaScript语言执行代码
阅读全文
摘要：/*alert(typeofnull);//null是一个对象的实例，但它并不指向Object构造器的实例，所以nullinstanceofObject是false。//Object构造器的实例指向空的对象实例，varobj=newObject()，所以objinstanceofObject是true。空的对象实例是原型继承的根基。空的对象实例的proto属性（不可访问的，隐藏的）指向null//所以null和空的对象实例，你是改变不了滴。varnum=0;for(varpropertyNameinnull){num++;alert(propertyName);//null可以有属性，但没有一
阅读全文
摘要：动态执行eval JavaScript的代码从是运行在一个闭包环境。JavaScript代码的解释执行过程：1.在JavaScript中，代码文本是先被解释为语法树，然后按照语法树来执行。2.在每次执行语法树中的一个函数的实例时，会将语法树中与该函数相关的形式参数、函数局部变量、upvalue以及子函数等信息复制到一个结构中，该结构称为ScriptObject(调用对象)。3.ScriptObject动态关联到一个闭包，闭包与ScriptObject具有不同的生存周期；4.按照语法树来执行函数体中的代码，需要访问变量时，先考察ScriptObject中的局部变量等，最后考察upvalue。这个
阅读全文
摘要：顺序语句1:var a=1;var b=2;var c=2; 顺序语句消灭1：var a=1, b=c=2;顺序语句2：var a= -1.11;a=Math.abs(a);a=Math.round(a);顺序语句消灭2：a.wsc(Math.abs).wsc(Math.round);分支语句1：if(a==1){b=2;}分支语句消灭1：(a==1) && b=2;抑或(a==1) ? b=2 :null;//其实if语句的大括号里面，可以throw，可以return，可以多条语句。但三目运算?:不能，可以通过封装个function，然后调用即可。因为函数是对多个表达式运算的
阅读全文
摘要：如果DOM和JSON看成一个前端数据库，那么，jQuery选择器就是一个SQL查询语句。无论是某单个节点元素，或者一组节点元素们，皆一条连续的语句搞定。当然，JSON的数据查询操作，还得需要手写循环筛选，而不是SQL语法式的查询。所谓jQuery链式操作，就是JavaScript的函数式风格写法，为了摆脱中间变量造成的程序代码难读（我觉得中间变量用于缓存数据，提高程序执行效率，这就是所谓性能与易读的不可兼得）。于是SQL式语法的选择器，直捣黄龙抓住核心数据，通过函数式语法的不间断连续处理，返回最终数据。所谓DOM，也就是树形结构的数据存储方式。所谓方法，也是树形结构的命名空间管理方式。既然jQ
阅读全文
摘要：ECMAScript5将严格模式(strict mode)引入了Javascript中，目的是允许开发人员能够选择“更好”的Javascript版本，这个版本能用不同的方式处理那些普遍而又臭名 昭著的错误。一开始的时候，我对该模式抱着怀疑的态度，因为当时在只有一款浏览器(Firefox)支持严格模式。时至今日，所有的主流浏览器的最新版本 ——包括IE10与Opera12——都支持严格模式。使用严格模式的时机已经成熟了。 它带来了什么? 严格模式给Javascript的运行方式带来了许多不同，我将它们分为了两类：明显的(obvious)，以及微妙的(subtle)。那些微妙 的改变是为了解决微.
阅读全文
摘要：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
阅读全文
摘要：//得到select项的个数2jQuery.fn.size=function(){3returnjQuery(this).get(0).options.length;4}56//获得选中项的索引7jQuery.fn.getSelectedIndex=function(){8returnjQuery(this).get(0).selectedIndex;9}1011//获得当前选中项的文本12jQuery.fn.getSelectedText=function(){13if(this.size()==0)return"下拉框中无选项";14else{15varindex=th
阅读全文
摘要：这是个人在最近使用json时做的总结，拿出来给没接触过的小弟们晒晒，适用与没接触过json的人员，其中json2。js请到json官网下载。来自http://kingshare01.iteye.com/blog/235351<scripttype="text/javascript"src="json2.js"></script><script>//直接声明json数据结构varmyJSONObject={"bindings":[{"ircEvent":"PRIVMSG&
阅读全文
摘要：jquery 里的each使用方法详解 有个同事问我each使用方法,我把我知道的用法告诉他.他却说不是这样的......如是在网上小逛了一下,果然用法有很多.下面总结下大慨的使用方法. each()函数是基本上所有的框架都提供了的一个工具类函数，通过它，你可以遍历对象、数组的属性值并进行处理。jQuery和jQuery对象都实 现了该方法，对于jQuery对象，只是把each方法简单的进行了委托：把jQuery对象作为第一个参数传递给jQuery的each方法.换句话 说：jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用。而jQuery对象提供的each..
阅读全文
摘要：关键字：tag 标签 输入标签化来自：http://xoxco.com/projects/code/tagsinput/ 这是一个JQuery插件，输入字符，按回车，变标签。基本原理：标签框是一个大DIV叫tags_3_tagsinput，DIV里有显示标签的span和输入用的input。当你在input里面输入一些字符，按回车 就变成一个span显示标签，插在input前面。强烈建议你，花上两个小时，下载它的DEMO，用firebug来调试，观察其对HTML DOM的影响。 功能：除了生成标签外，还能对输入重复标签进行检查，和JQuery autocomplete插件配合实现自动完成功能。
阅读全文