代码改变世界

随笔分类 - JavaScript

最新Angular2案例rebirth开源

2016-09-07 21:42 by 破狼, 13890 阅读, 收藏, 编辑
摘要:<img class="desc_img" src="http://images2015.cnblogs.com/blog/63184/201609/63184-20160907215027473-1476847941.jpg">在过去的几年时间里,Angular1.x显然是非常成功的。但由于最初的架构设计和Web标准的快速发展,逐渐的显现出它的滞后和不适应。这些问题包括性能瓶颈、滞后于极速发展的Web标准、移动化多平台应用,学习难度等。 所以Angular团队最终决定以全新方式构建Angular2框架。Angular2框架现在已经进入RC6版本,很快它就将进入最终发布版。Angular2带来了很多不错的特性,它们包括跨平台、高性能、高效开发,拥抱web标准等等。 阅读全文

《AngularJS深度剖析与最佳实践》简介

2015-12-31 09:47 by 破狼, 10582 阅读, 收藏, 编辑
摘要:<img src="http://img11.360buyimg.com/n1/jfs/t2164/170/1927361173/116828/d85d9ddf/5680e85dNdd2009df.jpg" class="desc_img"/>由于年末将至,前阵子一直忙于工作的事务,不得已暂停了微信订阅号的更新,我将会在后续的时间里尽快的继续为大家推送更多的博文。毕竟一个人的力量微薄,精力有限,希望大家能理解,仍然能一如既往的关注和支持shuang_lang_shuo[破狼]微信号,同时也欢迎大家的高质量文章的投稿。 在2015年一年时间中,我、雪狼大叔、彭洪伟一起共同编写了《AngularJS深度剖析与最佳实践》这本前端Angular.js框架的进阶书籍。在写作期间也得到很多人的支持,特别是在Angularjs中文社区群中的各位群友的持续关注。中途由于写作、出版流程等因素,花费了大家很长的等待时间,就在昨天《AngularJS深度剖析与最佳实践》这本书籍终于上市了,大家现在可以在京东上预订书籍了,相信出版社也会在很快的时间内送到大家手中。 阅读全文

JavaScript多线程之HTML5 Web Worker

2015-11-18 23:04 by 破狼, 9416 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/%E6%A1%A5%E5%92%8C%E5%A4%9A%E7%BA%BF%E8%B7%AF%E7%94%B5%E7%BA%BF.jpg" class="desc_img"/>在博主的前些文章Promise的前世今生和妙用技巧和JavaScript单线程和浏览器事件循环简述中都曾提到了HTML5 Web Worker这一个概念。在JavaScript单线程和浏览器事件循环简述中讲述了JavaScript出于界面元素访问安全的考虑,所以JavaScript运行时一直是被实现为单线程执行的;这也意味着我们应该尽量的避免在JavaScript中执行较长耗时的操作(如大量for循环的对象diff等)或者是长时间I/O阻塞的任务,特别是对于CPU计算密集型的操作。 例如在JavaScript中尝试计算像fibonacci这类计算密集型的操作,就会导致整个页面体验被blocked。HTML5 Web Worker的出现让我们在不阻塞当前JavaScript线程的情况下,在当前的Java 阅读全文

Angular移除不必要的$watch之性能优化

2015-11-12 08:25 by 破狼, 12129 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/%E6%9C%BA%E6%A2%B0%E8%A1%A8-%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96.jpg" class="desc_img"/>双向绑定是Angular的核心概念之一,它给我们带来了思维方式的转变:不再是DOM驱动,而是以Model为核心,在View中写上声明式标签。然后,Angular就会在后台默默的同步View的变化到Model,并将Model的变化更新到View。 双向绑定带来了很大的好处,但是它需要在后台保持一只“眼睛”,随时观察所有绑定值的改变,这就是Angular 1.x中“性能杀手”的“脏检查机制”($digest)。可以推论:如果有太多“眼睛”,就会产生性能问题。在讨论优化Angular的性能之前,笔者希望先讲解下Angular的双向绑定和watchers函数。 阅读全文

JavaScript单线程和浏览器事件循环简述

2015-10-29 23:48 by 破狼, 5381 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.com/images/blog_img/JavaScript%E5%8D%95%E7%BA%BF%E7%A8%8B-%E7%81%AB%E8%BD%A6%E8%BD%A8%E9%81%93.jpg" class="desc_img"/>在上篇博客《Promise的前世今生和妙用技巧》的开篇中,我们曾简述了JavaScript的单线程机制和浏览器的事件模型。应很多网友的回复,在这篇文章中将继续展开这一个话题。当然这里是博主的一些理解,如果还存在什么纰漏的话,请不吝指教。 JavaScript这门语言运行在浏览器中,是以单线程的方式运行的。说到单线程,就得从操作系统进程开始说起。进程和线程都是操作系统的概念。进程是应用程序的执行实例,每一个进程都是由私有的虚拟地址空间、代码、数据和其它系统资源所组成;进程在运行过程中能够申请创建和使用系统资源(如独立的内存区域等),这些资源也会随着进程的终止而被销毁。而线程则是进程内的一个独立执行单元,在不同的线程之间是可以共享进程资源的,所以在多线程的情况下,需要特别注意对临界资源的访问控制 阅读全文

Promise的前世今生和妙用技巧

2015-10-22 19:43 by 破狼, 13120 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.com/images/blog_img/%E6%8B%89%E9%92%A9-%E6%89%BF%E8%AF%BA-promise.jpg" class="desc_img"/>浏览器事件模型和回调机制 JavaScript作为单线程运行于浏览器之中,这是每本JavaScript教科书中都会被提到的。同时出于对UI线程操作的安全性考虑,JavaScript和UI线程也处于同一个线程中。因此对于长时间的耗时操作,将会阻塞UI的响应。为了更好的UI体验,应该尽量的避免JavaScript中执行较长耗时的操作(如大量for循环的对象diff等)或者是长时间I/O阻塞的任务。所以在浏览器中的大多数任务都是异步(无阻塞)执行的,例如:鼠标点击事件、窗口大小拖拉事件、定时器触发事件、Ajax完成回调事件等。当每一个异步事件完成时,它都将被放入一个叫做”浏览器事件队列“中的事件池中去。而这些被放在事件池中的任务,将会被javascript引擎单线程处理的一个一个的处理,当在此次处理中再次遇见的异步任务,它们也会被放到事件池中去,等待下一 阅读全文

自定义Angular插件 - 网站用户引导

2015-10-19 22:25 by 破狼, 4807 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/training-demo.png" class="desc_img"/>最近由于项目进行了较大的改版,为了让用户能够适应这次新的改版,因此在系统中引入了“用户引导”功能,对于初次进入系统的用户一些简单的使用培训training。对于大多数网站来说,这是一个很常见的功能。所以在开发这个任务之前,博主尝试将其抽象化,独立于现有系统的业务逻辑,将其封装为一个通用的插件,使得代码更容易扩展和维护。 阅读全文

smartcrop.js智能图片裁剪库

2015-10-13 22:48 by 破狼, 6102 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/smartcrop-%E5%9B%BE%E7%89%87%E8%A3%81%E5%89%AA-%E6%A1%88%E4%BE%8B.png" class="desc_img"/>今天将为大家介绍一款近期github上很不错的开源库 – smartcrop.js。它是一款图片处理的智能裁剪库。在很多项目开发中,经常会遇见上传图片的场景,它可能是用户照片信息,也可能是商品图片等。然而在网页布局中,为了更好的用户体验,它们往往都需要一些宽度和高度的限制。对于不合适的图片,常常需要为用户提供一种裁剪方式,以此来满足网站更好的用户体验。但是图片默认的裁剪区域往往被显示在一个固定的位置,而这个位置却往往又不是精准的用户裁剪位置。因此今天为大家介绍的这一款开源库,就是为了解决这类问题,并为用户提供更好的用户体验的。 阅读全文

ES7之Decorators实现AOP示例

2015-09-23 07:50 by 破狼, 2152 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/es7-decorators-log-aop.png " class="desc_img"/>在上篇博文CoffeeScript实现Python装潢器中,笔者利用CoffeeScript支持的高阶函数,以及方法调用可省略括符的特性,实现了一个类似Python装潢器的日志Demo。这只是一种伪实现,JavaScript实现装潢器,我们需要等到ECMAScript7才行,在ES7特性中带来了Decorators,它就是我们所需要的装潢器特性。虽然它是ES7的特性,但在Babel大势流行的今天,我们可以利用Babel来使用它。关于Babel的推荐文章,请参见另一篇文章Babel-现在开始使用 ES6。 下面我们仍然和上节CoffeeScript实现Python装潢器一样,实现一个ES7 Decorators版的日志拦截示例 阅读全文

CoffeeScript实现Python装潢器

2015-09-22 08:46 by 破狼, 1117 阅读, 收藏, 编辑
摘要:在上篇Angular遇上CoffeeScript – NgComponent封装中,我们讲述了CoffeeScript这门小巧的语言,摒弃JavaScript中糟粕(“坑”)部分,并将JavaScript中精粹部分发挥到淋淋尽致。虽然笔者更喜欢ES6 + Babel或者TypeScript这类鲜明特... 阅读全文

Verlet-js JavaScript 物理引擎

2015-09-19 22:42 by 破狼, 1245 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/verlet-js-Spiderweb.png" class="desc_img"/>subprotocol最近在Github上开源了verlet-js。地址为https://github.com/subprotocol/verlet-js。verlet-js是一个集成Verlet的物理引擎,利用JavaScript编写。verlet-js支持粒子系统、距离限制、角度限制等。其Github声称基于这些基础,则可以帮助我们构建几乎任何我们所能想象到的东西。 其官网为我们提供了一下几个demo: Shapes (verlet-js Hello world) Fractal Trees Cloth Spiderweb 阅读全文

Angular遇上CoffeeScript - NgComponent封装

2015-09-13 14:38 by 破狼, 2508 阅读, 收藏, 编辑
摘要:CoffeeScript是基于JavaScript的一门扩展小巧语言,它需要编译成JavaScript,然后再运行与浏览器或者Nodejs平台。JavaScript由于商业原因10天时间就匆忙诞生,所以存在很多弊病。但如《JavaScript精粹》一书中所说:JavaScript也存在着一颗华丽的心... 阅读全文

扩展Bootstrap Tooltip插件使其可交互

2015-09-12 19:05 by 破狼, 6887 阅读, 收藏, 编辑
摘要:最近在公司某项目开发中遇见一特殊需求,请笔者帮助,因此有了本文的插件。在前端开发中tooltip是一个极其常用的插件,它能更好向使用者展示更多的文档等帮助信息。它们通常都是一些静态文本信息。但同事他们的需求是需要动态交互,在文本信息中存在帮助网页的链接。如果使用常规tooltip,则在用户移出too... 阅读全文

前端获取元素定位位置的法宝

2015-09-08 17:23 by 破狼, 4508 阅读, 收藏, 编辑
摘要:在前端开发中,我们经常需要定位一个元素。如tooltip、popover或者modal等,或许是我们需要将它们定位在依赖元素的周围或屏幕滚动屏幕中心位置。这对于前端开发的码农来说并不是难事。算出和依赖元素的offset,设置元素的left、right。对于稍复杂的场景我们可能需要考虑被positio... 阅读全文

Angular Input格式化

2015-09-03 18:16 by 破狼, 8850 阅读, 收藏, 编辑
摘要:今天在Angular中文群有位同学问到:如何实现对input box的格式化。如下的方式对吗? 这当然是不对的。在Angular中filter(过滤器)是为了显示数据的格式,它将$scope上的Model数据格式化View显示的数据绑定到DOM之上。它并不会负责ngModel的绑定值的格式化。在An... 阅读全文

JavaScript函数编程-Ramdajs

2015-08-30 22:51 by 破狼, 7025 阅读, 收藏, 编辑
摘要:<img src="http://greengerong.github.io/images/blog_img/ramda-logo.png" class="desc_img"/>在JavaScript语言世界,函数是第一等公民。JavaScript函数是继承自Function的对象,函数能作另一个函数的参数或者返回值使用,这便形成了我们常说的高阶函数(或称函数对象)。这就构成函数编程的第一要素。在JavaScript世界中有很多的函数式编程库能辅助我们的JavaScript函数式体验,在它们之中最为成功的要数Underscore或lodash。 如下lodash实例代码: var users = [ { 'user': 'barney', 'age': 36 }, { 'user': 'fred', 'age': 40 }, { 'user': 'pebbles', 'age': 18 } ]; var names = 阅读全文

tsd-提升IDE对JavaScript智能感知的能力

2015-07-26 07:09 by 破狼, 10106 阅读, 收藏, 编辑
摘要:在编写前端JavaScript代码时,最痛苦的莫过于代码的智能感知(Intelli Sense)。追其根源,是因为JavaScript是一门弱类型的动态语言。对于弱类型的动态语言来说,智能感知就是IDE工具的一个“软肋”。IntelliJ等IDE所用智能感知方式,是一种折中的方式:全文搜索,然后展示... 阅读全文

Angular Module声明和获取重载

2015-07-06 08:39 by 破狼, 47597 阅读, 收藏, 编辑
摘要:module是angular中重要的模块组织方式,它提供了将一组内聚的业务组件(controller、service、filter、directive…)封装在一起的能力。这样做可以将代码按照业务领域问题分module的封装,然后利用module的依赖注入其关联的模块内容,使得我们能够更好的”分离关... 阅读全文

动态绑定HTML

2015-06-30 06:49 by 破狼, 18619 阅读, 收藏, 编辑
摘要:在Web前端开发中,我们经常会遇见需要动态的将一些来自后端或者是动态拼接的HTML字符串绑定到页面DOM显示,特别是在内容管理系统(CMS:是Content Management System的缩写),这样的需求,更是遍地皆是。对于对angular的读者肯定首先会想到ngBindHtml,对,ang... 阅读全文

ngModel 值不更新/显示

2015-06-29 07:13 by 破狼, 13682 阅读, 收藏, 编辑
摘要:angular中的$scope是页面(view)和数据(model)之间的桥梁,它链接了页面元素和model,也是angular双向绑定机制的核心。而ngModel是angular用来处理表单(form)的最重要的指令,它链接了页面表单中的可交互元素和位于$scope之上的model,它会自动把ng... 阅读全文

JavaScript函数柯里化

2015-05-11 20:36 by 破狼, 3856 阅读, 收藏, 编辑
摘要:函数式JavaScript是以函数为一等公民的函数式语言。函数在JavaScript中也是一个对象(继承制Function),函数也可以作为参数传递成函数变量。最近几年函数式也因为其无副作用的特性、透明性、惰性计算等在高并发,大数据领域火起来了。JavaScript中也有如Underscore、lo... 阅读全文

前端HTML-CSS规范

2015-05-10 08:25 by 破狼, 17216 阅读, 收藏, 编辑
摘要:目录HTML语法HTML5 doctype语言属性(Language attribute)字符编码IE 兼容模式引入 CSS 和 JavaScript 文件实用为王属性顺序布尔(boolean)型属性减少标签的数量JavaScript 生成的标签CSS语法声明顺序媒体查询(Media query)的... 阅读全文

前端JavaScript规范

2015-05-09 23:29 by 破狼, 5191 阅读, 收藏, 编辑
摘要:JavaScript规范目录类型对象数组字符串函数属性变量条件表达式和等号块注释空白逗号分号类型转换命名约定存取器构造器事件模块jQueryES5 兼容性HTML、CSS、JavaScript分离使用jsHint前端工具类型原始值: 相当于传值(JavaScript对象都提供了字面量),使用字面量创... 阅读全文

JavaScript工具库之Lodash

2015-04-11 16:08 by 破狼, 59216 阅读, 收藏, 编辑
摘要:你还在为JavaScript中的数据转换、匹配、查找等烦恼吗?一堆看似简单的foreach,却冗长无趣,可仍还在不停的repeat it!也许你已经用上了Underscore.js,不错,你已经进步很大一步了。然而今天我希望你能更进一步,利用lodash替换掉Underscore。lodash一开始... 阅读全文

(转)Babel-现在开始使用 ES6

2015-03-22 20:34 by 破狼, 58354 阅读, 收藏, 编辑
摘要:在 2 月 20 号 ECMAScript 第六版就正式推出了,这门语言一直保持稳定快速的发展而且新功能也在慢慢被现在主流的 JavaScript 引擎所接受。不过要想在浏览器端或者 Node 端直接运行 ES6 代码还得等上一些日子。幸好 TC39 (负责研究开发 EMCAScript 规格的组织... 阅读全文

Nightmare基于phantomjs的自动化测试套件

2014-11-20 19:28 by 破狼, 5183 阅读, 收藏, 编辑
摘要:今天将介绍一款自动化测试套件名叫nightmare,他是一个基于phantomjs的测试框架,一个基于phantomjs之上为测试应用封装的一套high level API。其API以goto, refresh, click, type…等简单的常用e2e测试动作封装,使得其语义清晰,简洁。其官方在... 阅读全文

TypeScript - Classes

2014-11-19 13:43 by 破狼, 33772 阅读, 收藏, 编辑
摘要:简介JavaScript语言基于函数和原型链继承机制的方式构建可重用的组件。这对于OO方面编程来说显得比较笨拙。在下一代的JavaScript标准ECMAScript 6为我们提供了基于class base的OO设计方式。在TypeScript中我们也允许使用这种方式,TypeScript将编译为目... 阅读全文

TypeScript - Interfaces

2014-11-17 12:58 by 破狼, 20374 阅读, 收藏, 编辑
摘要:简介关注于数据值的 ‘shape’的类型检查是TypeScript核心设计原则。这种模式有时被称为‘鸭子类型’或者‘结构子类型化’。。 在TypeScript中接口interfaces的责任就是命名这些类型,而且还是你的代码之间或者是与外部项目代码的契约。初见Interface理解interface... 阅读全文

TypeScript - 基本类型系统

2014-11-13 21:56 by 破狼, 29370 阅读, 收藏, 编辑
摘要:对于程序来说我们需要基本的数据单元,如:numbers, strings, structures, boolean 等数据结构。在TypeScript中我们支持很多你所期望在JavaScript中所拥有的数据类型系统。Boolean在JavaScript和TypeScript中也具有最基本的逻辑断言... 阅读全文

解决ng界面长表达式(ui-set)

2014-09-29 17:12 by 破狼, 1709 阅读, 收藏, 编辑
摘要:本文来自网友sun shine的问题,问题如下: 您好, 我想求教一个问题. 在$scope中我的对象名字写的特别深, 在 html中我又多次用到了同一个对象, 对不对在 html中让它绑定到一个临时变量呢? 比如: $scope.this.is.a.very.deep.ob... 阅读全文

Jasmine测试ng Promises - Provide and Spy

2014-09-29 16:20 by 破狼, 1771 阅读, 收藏, 编辑
摘要:jasmine提供了很多些很实用的处理Promises的方法,首先我们来考虑下面的这个例子: angular.module(&quot;myApp.store&quot;).controller(&quot;StoresCtrl&quot;, function($scope, StoreService, Contact) { ... 阅读全文

karma作为jQuery单元测试Runner

2014-09-07 08:50 by 破狼, 3580 阅读, 收藏, 编辑
摘要:karma作为angular测试runner出现,如果你使用过karma一定感受到这很不错的javascript测试runner。简单干净的配置文件karma.config.js,以及karma init一些快捷的配置command。以及整套测试套件,如html2js,coverage。对于angu... 阅读全文

Ng Http Request/response格式转换

2014-09-03 08:19 by 破狼, 4208 阅读, 收藏, 编辑
摘要:angular作为Single Page Application推荐的交互方式当然是基于json的ajax调用。但今天要说的是当你不幸工作在一个遗留或者不可控制的服务上,而这服务是基于非json提交方式(或许是常规表单(form)提交,或者其他自定义数据格式),那么我们只能改变ng内部$http默认... 阅读全文

angularjs之browserTrigger

2014-06-24 22:42 by 破狼, 2263 阅读, 收藏, 编辑
摘要:今天推荐一款来自angularjs源码的单元测试辅助库browserTrigger,这是来自于ngScenario的一段代码。主要用户触发浏览器型行为更新ng中scope view model的值。这是angularjs源码中单元测试的使用browserTrigger的实例:it(&#39;should s... 阅读全文

ng-template寄宿方式

2014-03-15 14:26 by 破狼, 19916 阅读, 收藏, 编辑
摘要:如果你是一个angular的开发者的话,对于ng-html2js你应该 很熟悉。对于angular的指令,我们经常需要定义模板( directive template/templateUrl),你可以选择讲html page 放在真正的的web容器中寄宿,也可以选择angular的ng-template 放在view的page之上,抑或也可以讲html打成一个js文件和directive 的js文件合并在一起发布。对于直接寄宿在web容器.这很简单,直接放在jetty,tomcat,iis, 抑或node express public目录下。这里没什么可以多说的,所以我们跳过。angul... 阅读全文

细说angular Form addControl方法

2014-02-22 09:30 by 破狼, 7424 阅读, 收藏, 编辑
摘要:在本篇博文中,我们将接触angular的验证。angular的验证是由form 指令和ngModel协调完成的。今天博主在这里想要说的是在验证在的一种特殊情况,当验证控件没有没有name属性这是不会被form捕获的。或者是你希望在ngRepeat中使用动态表达式。下面且让我们先来从angular源码中看起如下:首先是ngModel: var ngModelDirective = function() { return { require: [&#39;ngModel&#39;, &#39;^?form&#39;], controller: NgModelController, ... 阅读全文

Angularjs中文版本开发指南发布

2014-02-16 15:49 by 破狼, 46325 阅读, 收藏, 编辑
摘要:从本人开始在写关于Angularjs的文章开始,也算是见证了Angularjs在国内慢慢的火起来,如今的Angularjs正式如日中天。想知道为什么Angularjs会这么火,请移步angularjs移除不必要的$watch.也是一次偶然的机会,在Angular.js中文社区群里相遇一群Angula... 阅读全文

为Angularjs ngOptions加上index解决方案

2014-02-15 22:33 by 破狼, 15465 阅读, 收藏, 编辑
摘要:今天在Angularjs交流群中有位童学问道如何为Angular select的ngOptions像Angularjs的ngRepeat一样加上一个索引$index.其实对于这个问题来说Angular本身并未提供$index之类的变量供使用。但是也不是说对于这个问题我们就没有解决方案。把这个问题换成角度来看,我们所需要的就是js数组的下标,所以我们如果我们能够在对象上加入下标,使用表达式作为option的label就能解决了。但是第一印象让我想起的是js数组本来就是一个key/value的对象,只是key为数组下标而已,所以有了如下之设计:html: js:$scope.getDesc1 =. 阅读全文

Angular ngClick 阻止冒泡和默认行为

2014-02-11 23:29 by 破狼, 63255 阅读, 收藏, 编辑
摘要:这其实是一个很简单的问题,如果你认真查看过Angular官方的API文档,本来不想记录的。但是这个问题不止一次的被人问起,所以今天在记录在这里。在Angular中已经对一些ng事件如ngClick,ngBlur,ngCopy,ngCut,ngDblclick…中加入了一个变量叫做$event.如ngClick在官方文档是这么描述的:Expression to evaluate upon click. (Event object is available as $event)在查看Angular代码ngEventDirs.js: var ngEventDirectives = {}; fo... 阅读全文

angularjs组件之input mask

2013-12-15 20:36 by 破狼, 14336 阅读, 收藏, 编辑
摘要:今天将奉献一个在在几个angularjs项目中抽离的angular组件 input mask。在我们开发中经常会对用户的输入进行控制,比如日期,货币格式,或者纯数字格式之类的限制,这就是input mask的使用场景,在项目中也是会经常被提及需的需求之一。当然在官方的angular-ui ui-utils中有一个相应的组件叫做ui-mask,但是其mask功能是很初级脆弱的。所以我希望能得到一个更强大的mask组件。我所知的jquery.inputmask就是这样一个我所期望的强大的mask组件,所以我不必再去重造轮子,好的软件就是为了不停被重复利用。所以写了一个adapter,https:/ 阅读全文

angular ng-model类型格式转化

2013-12-15 09:43 by 破狼, 23861 阅读, 收藏, 编辑
摘要:在angular开发中我们经常会遇见输入框中的string的值,却想在scope上的model表现为整型、浮点、货币,或者在radio的value是一个true,false的Boolean类型,一组check box的vlue组成一个Array的数组类型,因为我们的后台程序的model设计接口如此。你是否还在后台应用程序或者ajax提交前做mapper,还在重复着着伪angular的做法?在本人github创建了一个开源项目[https://github.com/greengerong/ngmodel-format](https://github.com/greengerong/ngmodel 阅读全文

生成PDF的新选择-Phantomjs

2013-12-10 20:35 by 破狼, 13918 阅读, 收藏, 编辑
摘要:最近在node.js项目开发中,遇见生成PDF的需求,当然生成PDF不是一个新意的需求;我可以选择利用开源的pdfkit或者其他node pdf模块,或者通过edge.js调用.net/python下的pdf库去做生成pdf。但是在我看来对于这些东西不管如何也需要花费我们太多的时间(pdf报表的内容... 阅读全文

prerender-SPA程序的SEO优化策略

2013-12-09 01:22 by 破狼, 11356 阅读, 收藏, 编辑
摘要:随着web2.0的兴起,ajax的时代已经成为了事实,更如今Knockout,backbone, angular,ember前端MDV(model driver view)框架强势而来,Single Page Application已经为大家所熟悉了。如今常见的SPA程序,restfull和前端MDV之类的框架能够实实在在的减少我们的代码开发量,让我更多的注意力关注在真正的业务逻辑上。在众多前端MDV框架从博客中可以看出来笔者还是钟爱于angular,然而服务端平台的选择的话:在.net平台笔者会首选webapi+oData,jvm平台spring restfull。但是相应带来的是搜索引擎优 阅读全文

angularjs移除不必要的$watch

2013-08-20 00:40 by 破狼, 23811 阅读, 收藏, 编辑
摘要:在我们的web page,特别是移动设备上,太多的angular $watch将可能导致性能问题。这篇文章将解释如何去移除额外的$watch提高你的应用程序性能。 $watch如果不再使用,我们最好将其释放掉,在angular中我们可以自由的选择在什么时候将$watch从$watch列表中移除... 阅读全文

Angular.js Services

2013-08-18 11:28 by 破狼, 37110 阅读, 收藏, 编辑
摘要:Angular带来了很多类型的services。每个都会它自己不同的使用场景。我们将在本节来阐述。 首先我们必须记在心里的是所有的services都是singleton(单例)的,这也是我们所希望得到的预期结果。下面让我开始今天的services之旅吧:Constant示例:app.constant(&#39;fooConfig&#39;, {config1: true,config2: &quot;Default config2&quot;}); constant是个很有用的东东,我们经常会用于对directive之类的做配置信息。所以当你想创建一个directive,并且你希望能够做一些配 阅读全文

(翻译)Angular.js为什么如此火呢?

2013-08-11 21:02 by 破狼, 25574 阅读, 收藏, 编辑
摘要:在本文中让我们来逐步发掘angular为什么如此火: Angular.js 是一个MV*(Model-View-Whatever,不管是MVC或者MVVM,统归MDV(model Drive View))JavaScript框架,其是Google推出的SPA(single-page-application)应用框架,其为我们的web应用开发增加不少魔法变换。 我可以花整天的时间告诉你为什么你必须在新项目尝试angular.js,但是我觉得还是百说不如一练。数据绑定和scopes(作用域) 首先第一个浮出大脑的问题是:angular支持数据绑定吗?下面让我们来了解angular.js的数据... 阅读全文

语言设计中的鸭子类型风格

2013-06-30 10:24 by 破狼, 4118 阅读, 收藏, 编辑
摘要:在动态语言的世界里一直流传着一种叫做鸭子类型的风格,其来自谚语:“如果行鸭子一样走路,像鸭子一样呱呱叫,那它就是一只鸭子”。 从鸭子类型,我们可以联想到它的推导,并不在乎类型的真正实体,只要他的行为有鸭子的特性,那么我们就可以把它当做一只鸭子来看到。在动态语言设计中,可以解释为无论一个对象是什么类型的,只要它具有某类型的行为(方法),则它就是这一类型的实例,而不在于它是否显示的实现或者继承。 阅读全文

集成服务监控器-green.monitor发布

2013-05-26 18:42 by 破狼, 1764 阅读, 收藏, 编辑
摘要:在大型企业应用开发中,一个项目经常需要依赖于多个项目集成,经常某个集成服务的升级或者不工作,会导致你所工作的服务也挂掉,甚至影响你的开发流程。你是否还在接到测试团队或者运维团队的某个Bug,而自己花费了大量时间终于查出来是某个集成服务升级或异常,在这里浪费了大量时间,在笔者为所在项目建立了一个第三方集成服务监控的Monitor,去实时监控项目所依赖的所有集成服务,数据库。现在开源在github https://github.com/greengerong/green-monitor,在其sample目录下有个使用demo。mavendependency&lt;dependency&gt; &l 阅读全文

细说Angular ng-class

2013-05-22 09:41 by 破狼, 189392 阅读, 收藏, 编辑
摘要:在前面Angularjs开发一些经验总结中我们说到在angular开发中angular controller never 包含DOM元素(html/css),在controller需要一个简单的POJO(plain object javascript object),与view完全的隔离(交互angularjs框架的职责。但在某些项目中看见controller涉及DOM的元素最多的是在controller scope上定义某变量,其值为class name,形如:function ctr($scope){ $scope.test =“classname”;}&lt;div class=”{.. 阅读全文

Angularjs Controller 间通信机制

2013-04-16 20:54 by 破狼, 69257 阅读, 收藏, 编辑
摘要:在Angularjs开发一些经验总结随笔中提到我们需要按照业务却分angular controller,避免过大无所不能的上帝controller,我们把controller分离开了,但是有时候我们需要在controller中通信,一般为比较简单的通信机制,告诉同伴controller我的某个你所关心的东西改变了,怎么办?如果你是一个javascript程序员你会很自然的想到异步回调响应式通信—事件机制(或消息机制)。对,这就是angularjs解决controller之间通信的机制,所推荐的唯一方式,简而言之这就是angular way。 Angularjs为在scope中为我们提供了冒泡. 阅读全文

利用Node.js为Node.js生成HttpStatusCode辅助类并发布到npm

2013-04-09 00:07 by 破狼, 2497 阅读, 收藏, 编辑
摘要:作为一个好的Restfull Api不仅在于service url的语义,可读性,幂等,正交,作为http状态码也很重要,一个好的Http Status Code给使用者一个很好的响应,比如200表示正常成功,201表示创建成功,409冲突,404资源不存在等等。所以在做一个基于node.js+mongodb+angularjs的demo时发现node.js express没有提供相应的辅助类,但是本人不喜欢将201,404这类毫无语言层次语义的东西到处充斥着,所以最后决定自己写一个,但是同时本人也很懒,不喜欢做重复的苦力活,怎么办?那就从我最熟悉的c#中HttpStatusCode枚举中c. 阅读全文

edge.js架起node.js和.net互操作桥梁

2013-03-31 01:06 by 破狼, 6531 阅读, 收藏, 编辑
摘要:今天要介绍的是edge.js这个github上刚兴起的开源项目,它可以让node.js和.net之间在in-process下互操作。.net版本在4.5及以上,因为.net4.5带来的Task,asyn,await关键字和node.js的Event模型正好匹配。如果你感兴趣的话,可以参见githubhttps://github.com/tjanczuk/edge 和Edge.js overview.下面这幅图展示了edge.js在node.js和.net之间互操作的桥梁。Fun&lt;object,Task&lt;object&gt;&gt;表示输入为object类型,输出为Task&lt;o 阅读全文

Angularjs的IOC Inject分析

2013-03-27 00:50 by 破狼, 9761 阅读, 收藏, 编辑
摘要:在上一篇《Angularjs开发一些经验总结》中提到angular开发中的IOC inject优先,所以在这节将引用angularjs的注入代码来分析angularjs的注入方式。在《再谈angularjs DI(Dependency Injection)》中提到angularjs的注入方式分为3中方式,如果你还不清楚的请移步。推断式注入:在angularjs中我们可以在我们需要注入的地方按照名称注入,这里要求参数名称必须和注入服务实例名称相同,一种名称约定,angularjs会提取参数名称查找相应DI实例注入;:标记注入:在angularjs中我们可以利用$inject标注DI注入,这里需. 阅读全文

Angularjs开发一些经验总结

2013-03-24 17:08 by 破狼, 58628 阅读, 收藏, 编辑
摘要:在去年到今年参与了2个使用Angularjs作为客户端开发框架的项目开发。主要利用asp.net web api作为restfull服务提供框架和angularjs结合。Angularjs作为html的扩展,旨在建立一个丰富的动态web应用,通过Directive建立一套html扩展的DSL模型,利用PM模式变形MVVM(在网上很多称MVC模式,本人认为在angular0.8是属于经典MVC模式,但在1.0把scope独立注入过后,更倾向于MVVM模式,这将会后续随笔中写道)简化前端开发和使得前端业务逻辑得以分离,view和表现逻辑的分离,更便于维护,扩展。Angularjs本来就是采用TD. 阅读全文

JavaScript 函数replace揭秘

2013-03-14 09:18 by 破狼, 20330 阅读, 收藏, 编辑
摘要:在JavaScript中replace函数作为字符串替换函数,这是一个威力强大的字符串操作函数,对于常见字符串操作的推荐用法。这篇随笔就来更加深入的理解它。 replace函数接受两个参数,第一个参数为字符串或正则表达式,第一个参数同样可以接受一个字符串,还可能是一个函数。 首先对于第一个参数为字... 阅读全文

nodejs上HTML分析利器node-jquery

2013-02-27 18:13 by 破狼, 28573 阅读, 收藏, 编辑
摘要:首先描述产生这篇随笔的场景:我需要获取项目在jenkins构建的最新Javascript Coverage显示在供管理层次查看的项目情况Report上,但是由于jenkins没有直接的API取得数据所需数据,所以我们只能从自建的容器发布Javascript Coverage数据API,供Report项目使用。 由于采用简单的数据分析,只是Host一个简单的web Server,所以本人不喜欢Tomcat,IIS这类大型工具,显得有点杀鸡用牛刀,班门弄斧。我更喜欢node.js这类简易的web容器。所以项目采用node.js,并node.js天然的javascript与html操作的天然一体,. 阅读全文

利用Node.js本地构建

2013-02-23 23:12 by 破狼, 3289 阅读, 收藏, 编辑
摘要:Node.js是一个基于Google Chrome浏览器v8 javascript执行引擎的异步I/O事件驱动的运行平台。直从2009年诞生开始,已经在业界得到了很多的关注,在这里也必要多说,如果你还不清楚的,请移步到Node官网。在这里我们要讲的是用Node.js来构建本地Build。构建本地Build,我们已经有很多选择,如Ant,Maven,Gradle等。为什么我们还需要Node.js?对于我们的开发中会有一些小的基本自动化构建,如文件的监控(Less编译),javascript的压缩,不稳定集成服务代理,快速的集成反馈,文件的迁移…而对于项目来说我并不像引入太多的技术债, Node. 阅读全文

开源:Angularjs示例--Sonar中项目使用语言分布图(CoffeeScript版)

2012-12-20 21:50 by 破狼, 3283 阅读, 收藏, 编辑
摘要:关于SonarLanguage是什么东东,这里就不在描述了,如果你对它感兴趣的话,请移步到上篇随笔开源:Angularjs示例--Sonar中项目使用语言分布图。这里是最近学习CoffeeScript的练习版。 CoffeeScript是一门简洁的,构架于JavaScript之上的预处理器语言,可以静态编译成JavaScript,语法主要受ruby和python影响,目前已经为众多rails和node项目采用。CoffeeScript不是JavaScript的超集,也不是完全替代品。CoffeeScript有点在于:更少,更紧凑,和更清晰的代码通过规避和改变对JavaScript中不良部分的. 阅读全文

Javascript覆盖率(jstd)报表解析Maven插件

2012-12-16 22:03 by 破狼, 1387 阅读, 收藏, 编辑
摘要:最近项目中希望加入javascript覆盖率统计,由于项目的单元测试用的google的jstd(javascript test driver),jstd生成&lt;config filename&gt;-coverage.dat LCOV 格式,这是一种linux上格式,在window上网上搜寻了很久没找到可用的maven组件。最后狠下心来自己写一个。代码已经放在github上,并且maven插件也成功release到官网。coverage 文件格式: 项目主要采用java将coverage文件解析成java object在利用json序列化输出到固定位置的javascript文件。在利用an 阅读全文

TypeScript

2012-12-15 21:15 by 破狼, 1448 阅读, 收藏, 编辑
摘要:作为改进JavaScript应用程序开发的举措之一,微软近日发布了TypeScript。这一新语言是JavaScript规范的超集,添加了类型检查和静态代码分析,同时生成原生JavaScript。这些特性意在使开发者能够受益于类型检查带来的便利,从而更轻松地扩展JavaScript以支持更大规模的应用程序开发。现有的JavaScript代码在TypeScript中可以直接使用,而且因为TypeScript 生成的是纯JavaScript代码,因此可以在现有支持JavaScript的平台上运行。 并在Vs中带有强类型语法同样的智能等IDE支持,是的开发更容易,更容易将javascrip... 阅读全文

开源:Angularjs示例--Sonar中项目使用语言分布图

2012-12-02 11:24 by 破狼, 4388 阅读, 收藏, 编辑
摘要:在博客中介绍google的Angularjs 客户端PM模式框架很久了,今天发布一个关于AngularJs使用是简单示例SonarLanguage(示例位于Github:https://github.com/greengerong/SonarLanguage)。本项目只是一个全为客户端的示例项目。项目的初始是我想看看在公司的项目中使用语言的分布比例,看看C#的份额,这一年一直坐着Java项目,却还是喜欢着C#,这只是个人问题,不存在语言之争。公司的项目在持续集成CI后都会传递build数据到Sonar产生报表。所以我可以在Sonar获取到项目和项目使用语言,并且Sonar Restfull . 阅读全文

介绍一个JSONP 跨域访问代理API-yahooapis

2012-12-01 13:55 by 破狼, 3624 阅读, 收藏, 编辑
摘要:你是否遇到了想利用AJAX访问一些公网API,但是你又不想建立自己的代理服务,因为有时我根本就没打算涉及服务端任何代码,但是讨厌的浏览器的同源策略,阻止了我们的ajax调用。比如我想访问一个天气的restfull api,如果我直接去GET:$.get(&quot;http://m.weather.com.cn/data/101010100.html&quot;); 看见这问题相信大家都不会陌生,也会很自然的得到解决方案,但是我这里真的不想touch任何服务端代码,用jsonp吧,但是服务端没实现契约。在这里我是时候引入主角yahoo提供的jsonp代理:http://query.yahooa 阅读全文

angularjs 过滤器filter

2012-10-31 23:36 by 破狼, 43115 阅读, 收藏, 编辑
摘要:在前面介绍angularjs已经很多了,中途由于工作和一切生活琐事,暂停了很久。今天在这里将继续angularjs讲解,这节我们来看看angularjs的过滤去filter。 在我们开发中经常需要在页面显示给用户的信息需要一定处理格式化,才能显示给用户。比如时间本地化,或者yyyy-MM-dd HH:mm:ss格式,数字精度格式化,本地化,人名格式化等等。在angularjs中为我们提供了叫filter的指令,让我们能够很轻易就能做到着一些列的功能,angularjs内部为我们提供了number等很多内置的filter。并且我们能够很轻易的自定义自己的领域filter。 如下实例:html:. 阅读全文

angularjs表达式-Expression

2012-09-14 00:28 by 破狼, 25048 阅读, 收藏, 编辑
摘要:紧接上节谈到再谈angularjs DI(Dependency Injection),在这里介绍关于angularjs的表达式expression。expression指的是javascript的一小片段代码,通常用于绑定(binding)例如:{{ expression }}。在angularjs中是通过$parse service解析。 $parse用法: $parse(expression); 参数:javascript代码片段。 返回值:{function(context, locals)},表达式编译结果: context:嵌入表达式执行的作用于scope。 locals:... 阅读全文

再谈angularjs DI(Dependency Injection)

2012-09-11 19:42 by 破狼, 10818 阅读, 收藏, 编辑
摘要:在前面已经介绍了关于angularjs,以及扩展了一些jQuery ui的一些组件为angularjs的directive。在这里应进口007 在上篇留言我们来看看在angularjs中的DI特性。 DI:依赖注入,是一种软件设计模式,应DIP依赖倒置原则,描述组件之间高层组件不应该依赖于底层组件。依赖倒置是指实现和接口倒置,采用自顶向下的方式关注所需的底层组件接口,而不是其实现。其应用框架则为IOC,在.net中有很多我们熟悉的IOC框架,如Unity,Castle windsor,Ninject,Autofact等等,其常常分为构造注入,函数注入,属性注。同时在IOC和Service L. 阅读全文

AngularJS Slider指令(directive)扩展

2012-09-05 23:01 by 破狼, 6975 阅读, 收藏, 编辑
摘要:继上一篇基于jQuery UI Autocomplete的AngularJS 指令(directive)扩展,在这里发布一个AngularJS的Slider扩展。如果你还不了解AngularJS话的情参见AngularJs - Javascript MVC 框架,Angular-Bootstrap和Compiler以及Google-AngularJS官方文档. 下面直接看代码演示吧,借助我们强大的jsfiddle:链接地址http://jsfiddle.net/whitewolf/vNfsm/20/embedded 这里借助于jsfiddle可能加载速度有点慢,请耐心等待。同时有什么问题请.. 阅读全文

基于jQuery UI Autocomplete的AngularJS 指令(directive)扩展

2012-09-02 10:38 by 破狼, 7795 阅读, 收藏, 编辑
摘要:在前几篇随笔简单介绍了AngularJS,在AngularJS 指令(directive)是重要的概念,主要负责了很大部分的组建样式交互。在前面介绍过directive需要预先的模板编译在返回一个link的函数,注册行为事件交互等等。在这里不多说了,关于指令的介绍将在后续一并补上。在这里我们先看一个利用jQuery UI组件开发的AngularJS Autocomplete指令。代码:jsfiddle在线测试Directive:1varoldSuggest=jQuery.ui.autocomplete.prototype._suggest;2jQuery.ui.autocomplete.p.. 阅读全文

Angular-Bootstrap和Compiler

2012-08-13 23:50 by 破狼, 17152 阅读, 收藏, 编辑
摘要:在上节简单介绍了Angular js框架,在这节将继续Angular的Bootstrap(引导)和Compiler(编译)机制。一:Bootstrap:Angular的初始化 1:Angular推荐的自动化初始如下:1&lt;!doctypehtml&gt;23&lt;htmlxmlns:ng=&quot;http://angularjs.org&quot;ng-app&gt;45&lt;body&gt;67...89&lt;scriptsrc=&quot;angular.js&quot;&gt;1011&lt;/body&gt;1213&lt;/html 利用ngapp标示你需要自动引导应用 阅读全文

AngularJs - Javascript MVC 框架

2012-08-12 23:25 by 破狼, 18595 阅读, 收藏, 编辑
摘要:在6月google发布了AngularJs 1.0稳定版, 并宣称:AngularJS可以让你扩展HTML的语法,以便清晰、简洁地表示应用程序中的组件,并允许将标准的HTML作为你的模板语言,AngularJS可以通过双向数据绑定自动从拥有JavaScript对 象(模型)的UI(视图)中同步数据。 开始接触AngularJs是在4月份来到新项目组,这时AngularJs还处于0.8未稳定版,项目中已经开始使用了,并且这套框架应用到了项目整个UI端,服务端也是未稳定的web api,真心佩服团队的勇气,对于新技术的热情,幸好大家都能很好的驾驭,这是第一次尝试一个充满未稳定技术的项目。 回到正. 阅读全文

Less动态css-演讲稿(ppt)

2012-07-24 23:18 by 破狼, 1708 阅读, 收藏, 编辑
摘要:LESS 将 CSS 赋予了动态语言的特性,如 变量, 继承, 运算, 函数,混合,守卫,命名空间,字串符插值。 LESS 既可以在 客户端 上运行 (支持IE 6+, Webkit, Firefox),也可以借助Node.js或者Rhino在服务端运行。 Less是一个JS库,所以他可以在客户端运行,相对Sass则必须在服务端借助Ruby运行(Sass和Less区别,可以参见LESS介绍,和与Sass的比较)。本演讲稿主要涉及Less程序式特性和Less常见使用方式: 变量 混合 嵌套规则 函数&amp;运算 模式匹配和守卫(Guards ) 字符串插值 ... 阅读全文

JQuery模板插件jquery.tmpl-动态ajax扩展

2011-11-09 20:21 by 破狼, 4056 阅读, 收藏, 编辑
摘要:在上一篇JQuery模板插件-jquery.tmpl中介绍了这款插件。有时我们需要去动态的ajax去加载模板,或者数据,根据url参数或者其他信息加载不同的模板,数据。在我的某个项目中有这个需求,所以特地写成jquery工具函数,加入了本地数据和ajax数据加载模板,数据的方式。参数说明:Tmpl: function(template, data, fun) 1:template:1): url: 为ajax的加载url,ajax当且仅当remote= true时候加载。2):data: 为ajax加载参数3) templateSelector: 为本地模板选择器,当且仅当remote= f. 阅读全文

JQuery模板插件-jquery.tmpl

2011-10-09 20:48 by 破狼, 38762 阅读, 收藏, 编辑
摘要:在下面介绍一款jQuery的模板插件 tmpl,是由微软想jQuery官方贡献的模板插件,网址:http://api.jquery.com/jquery.tmpl/。 Tmpl提供了几种tag:${}:等同于{{=}},是输出变量,通过了html编码的。{{html}}:输出变量html,但是没有html编码,适合输出html代码。{{if }} {{else}}:提供了分支逻辑。{{each}}:提供循环逻辑,$value访问迭代变量。下面一个简单的模板tmpl实例:(代码最能说明一切)效果: 代码:View Code &lt;%@PageLanguage=&quot;C#&quot;Aut 阅读全文

jQuery右键菜单contextMenu实例

2011-09-28 20:53 by 破狼, 35704 阅读, 收藏, 编辑
摘要:好久没写博客了,今天简单介绍一款jQuery鼠标右键菜单contextMenu,这里首先要感谢 我的漫漫程序之旅(原文http://www.blogjava.net/supercrsky/articles/250091.html)。在最近项目中需要频繁的右键菜单操作。我采用了contextMenu这款jQuery插件。 在下面我们将设计一个场景,表格grid需要在每行实现鼠标右键,增加,删除,保存操作。grid我就用gridview了,随便用微软提供的样式,测试用例不用搞的多好看嘛,我也不是做美工了,哈哈,偷偷懒。先上效果图,是有些同志说的有图才有真相嘛: ui代码:View Code &lt 阅读全文

jQuery Ajax 仿AjaxPro.Utility.RegisterTypeForAjax辅助方法

2011-09-26 20:57 by 破狼, 4850 阅读, 收藏, 编辑
摘要:我们都知道在AjaxPro的方法AjaxPro.Utility.RegisterTypeForAjax(typeof(所在类的类名));会将标记有[Ajax.AjaxMethod]方法注册在客户端。在某项目中,设计模板字段引擎,采用html+jquery实现,这里的数据就难免需要ajax获取,但是团队对于js掌握不一,所以我写了下面辅助类,可以像ajaxpro一样简化ajax的开发。代码-jQueryInvokeMethodAttribute (此处只做标示方法处理,所以为空):[AttributeUsage(AttributeTargets.Method,AllowMultiple=fal. 阅读全文

StringTemplate遇见jQuery的冲突

2011-09-21 21:56 by 破狼, 867 阅读, 收藏, 编辑
摘要:最近在做一个流程引擎,现着手于自定义模板的处理。设计在模板中所有的数据都将与字段对应,采用xml结构序列化作为流程持久化机制。字段对于用户的输入则为字段,字段涉及到用户的输入,必定是控件。由于有以前项目word模板转化为在线展示输入经验(这里不仅仅是将word转化为html,还需要提取word书签作为关键字段,关键字段作为用户的输入,根据用户配置转化为文本框,下拉框,数字,货币框,时间等等可扩展控件)。我在本次的模板设计中不再考虑服务器控件,因为服务器控件将生成一大堆难以控制的html标记。所以彻底疯狂了一把,采用完全html+jQuery实现(验证用的也是jQuery validator). 阅读全文

我的jQuery动态表格插件二

2011-04-13 11:46 by 破狼, 5453 阅读, 收藏, 编辑
摘要:本篇博客是我写在离职后,昨天刚辞职和交接完任务,准备离开。其实我有很多不舍,但是最终还是选择了离开,许多苦楚都埋在我的心底。哎,趁回成都找工作的机会是该好好休息一下了。 在上篇我的jQuery动态表格插件中介绍了插件的基本使用方法.在实际运用的时候出现了一些其他的需求,所以插件再次升级,增加了一些辅助功能.1:EnterToTab:$(“selector”). EnterToTab(),是的selector中的空间可以回车变为tab键使用,方便用户的输入。代码简析:IE:View Code if($.browser.msie){$(host).live(&quot;keydown&quot;, 阅读全文

我的jQuery动态表格插件

2011-03-25 00:02 by 破狼, 7214 阅读, 收藏, 编辑
摘要:在我的页面处理中有时需要进行表单处理,需要一个用户可以添加修改多条记录。在这里我们需要控制用户的输入验证,表格的添加删除,用户输入数据的统计聚合,还有相应的计算列比如商品的总价=商品的单价*商品数量,再如,同时在用户提交的时候我还要需要获取提交到后台服务端处理在存储到我们的数据库。本插件则简单的处理了这些繁琐的事情。插件属性说明:1:rowTemplate:这是插入列的模板,在模板中我们的序号这种行号标示的需要rownum 的class。在模板中的需要唯一编号的比如我们的radiobutton的name属性在每个td单元格需要唯一的name组,再如id这种需要唯一的属性,需要{0}的占位符。. 阅读全文

JS的一些扩展:String、StringBuilder、Uri

2010-11-19 09:50 by 破狼, 796 阅读, 收藏, 编辑
摘要:在最近一个小屁项目中,没有服务端(其实服务端是人家早已经写好的服务),留给我的就只有一大堆的Html和JS,写的好烦躁,所以就写了几个扩展。多个不说的,这里只是记录,code附上,便以后查询:代码 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->;St... 阅读全文

jQuery 1.4 版本的十五个新特性-转载

2010-07-27 17:18 by 破狼, 710 阅读, 收藏, 编辑
摘要:jQuery 1.4 最近发布了。 超乎大家的预期,这次并非简单的修修补补,1.4 包含了很多新特性、功能增强和性能提升!本文即向您介绍这些可能对你十分有用的新特性和优化增强。你可以立刻下载jQuery 1.4试用: http://code.jquery.com/jquery-1.4.js1. 传参给 jQuery(&#8230;)之前,jQuery可以通过 attr 方法设置元素的属性,既可传属... 阅读全文

jquery:利用jsonp跨域访问--转载

2010-07-27 16:57 by 破狼, 10177 阅读, 收藏, 编辑
摘要:客户端的跨域访问,可以通过jsonp方式来实现,jquery提供了跨域访问的方法, jQuery.ajax()支持get方式的跨域。当然支持跨域还需要服务器端相应的处理。$.ajax({ async:false, url:'',//跨域URL type:'GET', dataType:'jsonp', jsonp:'jsoncallback',//默认callback data:mydata,/... 阅读全文

用一句JQuery代码实现表格的简单筛选

2010-07-26 09:15 by 破狼, 4539 阅读, 收藏, 编辑
摘要:JQuery的强大之处,这里就不用讲了。这里将用一行简单的JQuery代码实现简单的表格筛选。先贴上代码:代码 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->&lt;%@PageLanguage="C#"AutoEventWireup="true"C... 阅读全文

jQuery系列之目录汇总

2010-06-09 18:41 by 破狼, 5918 阅读, 收藏, 编辑
摘要:最近一个月写了些关于jQuery的文章,谢谢大家的支持。文章仅我个人观点,也许有不对的地方,请指出。这个系列还在更新中一:jQuery基础系列:jQuery温习篇---强大的JQuery选择器jQuery之工具函数jQuery之筛选函数jQuery1.4.2新特性(翻译)jQuery Ajax 回顾jQuery 1.4 版本的十五个新特性-转载 二:jQuery插件系列:jQuery Alert Dialogs (Alert, Confirm, &amp; Prompt Replacements)(翻译)jQuery File Tree(翻译)关于jConfirm回传的解决方案我的jQuery 阅读全文

关于jConfirm回传的解决方案

2010-06-09 14:24 by 破狼, 6034 阅读, 收藏, 编辑
摘要:在jQuery Alert Dialogs (Alert, Confirm, &amp; Prompt Replacements)(翻译)发布后,受到大家的很多鼓励,在这里先感谢大家。 在昨天lastwinter留言关于jConfirm的问题,如下 我趁今天有空就考虑了下。我觉得lastwinter问这个问题应该是关于ASP.NET的回传问题,这主要是jConfirm这个为CallBack回调, ... 阅读全文

Ajax杂谈

2010-05-14 09:13 by 破狼, 2222 阅读, 收藏, 编辑
摘要:Google Suggest 和Google Map的出现,引起了我们Web开发者的一次震动。随着Ajax技术的出现、盛行,本被忽视认为是二流编程语言的JavaScript脚本也开始了新的盛行,大量的JavaScript框架的出现如Microsoft Asp.Net Ajax、jQuery等。Ajax已经成为这些脚本框架必不可少的组成部分了,而且Ajax的开发也越来越简单化。 Ajax是一种已不是... 阅读全文

jQuery Ajax 回顾

2010-05-13 00:46 by 破狼, 2049 阅读, 收藏, 编辑
摘要:在本节我准备只写上关于Ajax的说明,多数来自jQuery的帮助文档,所以不要放在首页。因为我觉得首页应该是要花费了时间和心思的作品,本次的自我感觉不够这个标准,呵呵。代码演示和jQuery Ajax 一些新的,将在下一次有空时讲述,这里就不讲了。时间已经0晨了。如果大家觉得有什么jQuery的疑问或者觉得Ajax该讲述那些内容的都可以跟我留言,只要我有时间和能力,我就一定会尽力满足大家。1. l... 阅读全文

jQuery File Tree(翻译)

2010-05-11 23:58 by 破狼, 6778 阅读, 收藏, 编辑
摘要:继上一篇文章,今天我要讲一个Jquery File Tree 的插件。它的官方网站是http://abeautifulsite.net/2008/03/jquery-file-tree/。当前版本是1.01,下载地址为:http://labs.abeautifulsite.net/projects/js/jquery/fileTree/jquery.fileTree-1.01.zip。它主要是利用... 阅读全文

jQuery Alert Dialogs (Alert, Confirm, & Prompt Replacements)(翻译)

2010-05-09 15:12 by 破狼, 17301 阅读, 收藏, 编辑
摘要:前不久在官方网站是看见这个插件,所以今天趁有空就看了一下,随便给大家共享一下。也许你早已知道了,如果是这样那请跳过,不要拍砖。这个Jquery插件的目的是替代JavaScript的标准函数alert(),confirm(),和 prompt()。这个插件有如下这些特点: 1:这个插件可以使你可以支持你自己的css制定。使你的网站看起来更专业。 2:允许你自定义对话框的标题。 3:在IE7中,可以使... 阅读全文

jQuery之筛选函数

2010-05-01 17:37 by 破狼, 9304 阅读, 收藏, 编辑
摘要:jQuery的筛选函数提供了串联、查找和过滤函数,为我们的jQuery对象操作带来了很多的方便,今天我们就来温习下jQuery带来的这些筛选函数。1:串联函数:(1):andSelf()return:jQuery;explain:加入先前所选的加入当前元素中对于筛选或查找后的元素,要加入先前所选元素时将会很有用。test:&lt;div&gt;&lt;p&gt;test&lt;/p&gt;&lt;... 阅读全文

jQuery之工具函数

2010-04-29 10:23 by 破狼, 5190 阅读, 收藏, 编辑
摘要:jquery为我们提供了操作数组和对象的工具函数,方便和简化了我们对它们的操作。今天我们就进入jQuery的工具函数的复习。 jQuery给我们提供了主要有5类工具函数:URL字符串操作数组和对象操作测试操作浏览器 1:URL操作:$.param(obj) 返回 :string;说明:将jquery对象按照name/value 或者key/value序列化为URL参数,用&amp;连接。示例:va... 阅读全文

jQuery1.4.2新特性(翻译)

2010-04-23 13:02 by 破狼, 3897 阅读, 收藏, 编辑
摘要:jQuery官方一如往常提供Minified和Regular两个版本供我们下载。Minified用Gzipped压缩24Kb,Regular为155Kb。我们可以从Google或者Microsoft&#8217;s CDNs下载jQuery1.4.2版本。下载地址为:http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.jshtt... 阅读全文

jQuery温习篇---强大的JQuery选择器

2010-04-23 09:02 by 破狼, 3081 阅读, 收藏, 编辑
摘要:学习jQuery已经有1年多的时间了,但是一直由于做WinForm程序开发没有经常实践。现在又开始重拾WebForm开发。写几篇jQuery系列,温习下jQuery框架的知识。在jQuery出世以来,它取得很大的成就和认同。JQuery是一个轻量级的JavaScript框架,它的发布版很小仅16K左右。它能让你方便简洁的写出漂亮的动画效果、实现各种视觉效果,轻松的处理JavaScript的DOM数... 阅读全文