利用HTML5&AJAX验证表单(转)

stackoverflow上看到这段代码,很有用,不需要再找jquery的插件或自己写js来做验证,在提交时利用html5手动控制验证过程。

jQuery.getJSON跨域使用备注

1.引用jQuery:

2.js代码:

上面的代码是从网上找的。

3.后台要输出请求到的回调函数加json格式的返回参数:

网上的大多数教程普遍只说明前台调用,而没有后台输出的说明,这样会报错;

对于callback=?的设置,可以设置具体js回调函数,如果使用?,则默认会进入$.getJSON(url,function(data){这里处理});

jQuery的getJSON方法唯一的缺陷如果因某些原因调用失败无法捕捉,通过ajaxSetup可以很完美弥补这一点。

zepto使用备注

zepto没有jquery的属性过滤器,所以在查询时,会有一些差异。

zepto取select元素的text值:

Zepto的可用插件列表(带对勾的是默认包含的):

模块名称 默认包含 说明
zepto 核心模块,包含大部分方法
event 通过 on() & off()绑定事件
ajax XMLHttpRequest and JSONP 方法
form 序列化 & 提交表单
ie Add support for Internet Explorer 10+ on desktop and Windows Phone 8.
detect Provides $.os and $.browser information
fx The animate() method
fx_methods Animated show, hide, toggle, and fade*() methods.
assets Experimental support for cleaning up iOS memory after removing image elements from the DOM.
data A full-blown data() method, capable of storing arbitrary objects in memory.
deferred Provides $.Deferred promises API. Depends on the “callbacks” module.
When included, $.ajax() supports a promise interface for chaining callbacks.
callbacks Provides $.Callbacks for use in “deferred” module.
selector Experimental jQuery CSS extensions support for functionality such as $('div:first') and el.is(':visible').
touch Fires tap– and swipe–related events on touch devices. This works with both touch (iOS, Android) and pointer events (Windows Phone).
gesture Fires pinch gesture events on touch devices
stack Provides andSelf & end() chaining methods
ios3 String.prototype.trim and Array.prototype.reduce methods (if they are missing) for compatibility with iOS 3.x.

因为官方没有做一个包含所有module的full package,所以有人封装了一个:

TypeScript简介

TypeScript是微软在今年10月2日发布的一门新语言,这门新语言的功能并不是代替js,而是用强类型的方式,来生成js。

TypeScript的负责人是Anders Hejlsberg,C#之父。

官方对TypeScript的定义是:

TypeScript是一种为大规模javascript开发而产生的语言;TypeScript跨平台,跨浏览器。

意思应该是一次编译,到处运行,解决了浏览器对js的差异化吧。

TypeScript是在javascript的语法基础上产生的,语法与javascript类似;

与TypeScript类似的语言有Dart;与TypeScript类似的功能有Coffee-Script。事实上TypeScript是在前两者已存在的前提下,被推出的。

新发布的VS2012可以对TypeScript提供完整的支持,下载vs2012插件: TypeScript for Visual studio 2012

对于其他不支持vs2012的平台(如linux、mac、windows xp等),可以通过node.js包管理器获得:

npm install -g typescript

下面是我在windows XP上安装的过程:

C:\Documents and Settings\dujianyu>npm install -g typescript
npm http GET https://registry.npmjs.org/typescript
npm http 200 https://registry.npmjs.org/typescript
npm http GET https://registry.npmjs.org/typescript/-/typescript-0.8.0.tgz
npm http 200 https://registry.npmjs.org/typescript/-/typescript-0.8.0.tgz
C:\Documents and Settings\dujianyu\Application Data\npm\tsc -> C:\Documents and
Settings\dujianyu\Application Data\npm\node_modules\typescript\bin\tsc
typescript@0.8.0 C:\Documents and Settings\dujianyu\Application Data\npm\node_mo
dules\typescript

TypeScript编译器命令是tsc 后跟TypeScript的源文件名称:

C:\Documents and Settings\dujianyu>tsc
Syntax:   tsc [options] [file ..]

Examples: tsc hello.ts
tsc –out foo.js foo.ts
tsc @args.txt

Options:
-c, –comments  Emit comments to output
–declarations  Generates corresponding .d.ts file
-e, –exec      Execute the script after compilation
-h, –help      Print this message
–module KIND   Specify module code generation: “commonjs” (default) or “amd”
–nolib         Do not include a default lib.d.ts with global declarations
–out FILE      Concatenate and emit output to single file
–target VER    Specify ECMAScript target version: “ES3” (default), or “ES5”
-w, –watch     Watch output files
@<file>         Insert command line options and files from a file.

TypeScript是开源的,源代码地址:http://typescript.codeplex.com/
TypeScript官方地址:http://www.typescriptlang.org/
TypeScript文档:http://go.microsoft.com/fwlink/?LinkId=267121 (.doc),http://go.microsoft.com/fwlink/?LinkId=267238 (.pdf)

(转)javascript添加事件、动态添加、修改、删除对象的属性和方法


var msg = “参数”;
if (window.attachEvent)
{
//支持 IE
btn.attachEvent(“onclick”, function () { showMessage(msg) });
}
else
{
//支持 FF
btn.addEventListener(“click”, function () { showMessage(msg) }, false);
}
添加和删除事件
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Continue reading “(转)javascript添加事件、动态添加、修改、删除对象的属性和方法”

(转)jQuery页面滚动到指定节点id

以前很多博主都写过/转载过用 jQuery 实现页面滚动(Scroll)效果的方法,但目前搜来的方法大都在 Opera 下有个小 Bug:直接用跳的而且画面闪烁。
今天,超级低调的高手 Willin 共享了一种完美方法解决 jQuery 实现滚动效果在 Opera 下的bug,我随即调试+应用到我目前的主题,目前经过测试非常完美,特意贴出代码加以说明。

Continue reading “(转)jQuery页面滚动到指定节点id”

(转)jQuery性能优化

原文地址:http://www.artzstudio.com/2009/04/jquery-performance-rules/


代码优化分多个方面,而性能是主要的优化目标。本文将从对象缓存、DOM操作等12个方面讲解如何优化jQuery代码的执行效率,从而总体提升代码性能。
1、总是从ID选择器开始继承
在jQuery中最快的选择器是ID选择器,因为它直接来自 于JavaScript的getElementById()方法。
例如有一段HTML代码:

Continue reading “(转)jQuery性能优化”

(转)jQuery.Autocomplete 使用手册

1.网上有人说对中文的检索时处理有问题,经过测试此版本没有问题^-^

2.在使用远程地址时,它默认传入的参数是:q(输入值),limit(返回结果的最大值),可以使用extraParams传入其他的参数

3.autocomplete在使用ajax传递参数时,默认使用了get方式传递,也实在是没有找到可以通过参数提交post方式的办法。

解决方式1:在使用ajax的get方式传递中文时,使用new String(request.getParameter("q").getBytes("iso8859-1"),"utf-8")获得参数值

解决方式2:修改jquery.autocomplete.js代码,把get方式修改为post方式,然后参见之前ajax解决中文乱码的问题的

Continue reading “(转)jQuery.Autocomplete 使用手册”

图片左转、右转实现

代码是在网上别人的基础上修改的。
bigImg是要旋转的image,RoundLeft是左转按钮;roundRight是右转按钮;

[转]深入理解Javascript闭包(closure)

最近在网上查阅了不少Javascript闭包(closure)相关的资料,写的大多是非常的学术和专业。对于初学者来说别说理解闭包了,就连文字叙述都很难看懂。撰写此文的目的就是用最通俗的文字揭开Javascript闭包的真实面目。
一、什么是闭包?
“官方”的解释是:所谓“闭包”,指的是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。
相信很少有人能直接看懂这句话,因为他描述的太学术。我想用如何在Javascript中创建一个闭包来告诉你什么是闭包,因为跳过闭包的创建过程直接理解闭包的定义是非常困难的。看下面这段代码:

Continue reading “[转]深入理解Javascript闭包(closure)”