一.----------------------------------------------------------jQuery.validate 表單驗證

二.------------------------------jqZoom[jqZoom.pack]

三.------------------------------json2.js json和字符串的轉(zhuǎn)換

第一章：jquery.validate

A.相關(guān)文檔：

網(wǎng)易[入海數(shù)沙]：http://banu.blog.163.com/blog/static/23146482009111941249376/

腳本：http://www.jb51.net/article/24078.htm

博客園：http://www.rzrgm.cn/si-shaohua/p/3780321.html

B.使用教程

默認校驗規(guī)則
(1)required:true               必輸字段
(2)remote:"check.php"          使用ajax方法調(diào)用check.php驗證輸入值
(3)email:true                  必須輸入正確格式的電子郵件
(4)url:true                    必須輸入正確格式的網(wǎng)址
(5)date:true                   必須輸入正確格式的日期
(6)dateISO:true                必須輸入正確格式的日期(ISO)，比如：2009-06-23。1998/01/22 僅僅驗證格式，不驗證有效性
(7)number:true                 必須輸入合法的數(shù)字(負數(shù)，小數(shù))
(8)digits:true                 必須輸入整數(shù)
(9)creditcard:                 必須輸入合法的信用卡號
(10)equalTo:"#field"           輸入值必須和#field同樣
(11)accept:                    輸入擁有合法后綴名的字符串（上傳文件的后綴）
(12)maxlength:5                輸入長度最多是5的字符串(漢字算一個字符)
(13)minlength:10               輸入長度最小是10的字符串(漢字算一個字符)
(14)rangelength:[5,10]         輸入長度必須介于 5 和 10 之間的字符串")(漢字算一個字符)
(15)range:[5,10]               輸入值必須介于 5 和 10 之間
(16)max:5                      輸入值不能大于5
(17)min:10                     輸入值不能小于10

名稱	返回類型	描寫敘述
validate(options)	返回:Validator	驗證所選的FORM
valid()	返回:Boolean	檢查是否驗證通過
rules()	返回:Options	返回元素的驗證規(guī)則
rules("add",rules)	返回:Options	添加驗證規(guī)則
rules("remove",rules)	返回:Options	刪除驗證規(guī)則
removeAttrs(attributes)	返回:Options	刪除特殊屬性而且返回他們
Custom selectors
:blank	返回:Validator	沒有值的篩選器
:filled	返回:Array <Element >	有值的篩選器
:unchecked	返回:Array <Element >	沒選擇的元素的篩選器
Utilities
jQuery.format (template,argument ,argumentN...)	返回:String	用參數(shù)取代模板中的 {n}

validate ()的可選項：
debug:進行調(diào)試模式（表單不提交）:	$(".selector").validate ({   debug:true })
把調(diào)試設(shè)置為默認:	$.validator.setDefaults({   debug:true })
submitHandler: 通過驗證后執(zhí)行的函數(shù),里面要加上表單提交的函數(shù),否則表單不會提交	$(".selector").validate({   submitHandler:function(form) { $(form).ajaxSubmit();   } })
ignore: 對某些元素不進行驗證	$("#myform").validate({   ignore:".ignore" })
rules: 自己定義規(guī)則,key:value的形式,key是要驗證的元素,value能夠是字符串或?qū)ο?span lang="EN-US">	$(".selector").validate({   rules:{     name:"required",     email:{       required:true,       email:true     }   } })
messages: 自己定義的提示信息key:value的形式key是要驗證的元素,值是字符串或函數(shù)	$(".selector").validate({   rules:{     name:"required",     email:{       required:true,       email:true     }   },   messages:{     name:"Name不能為空",     email:{       required:"E-mail不能為空",       email:"E-mail地址不對"     }   } })
groups: 對一組元素的驗證,用一個錯誤提示,用error Placement控制把出錯信息放在哪里	$("#myform").validate({  groups:{    username:"fname lname"  },  errorPlacement:function(error,element) {     if (element.attr("name") == "fname" || element.attr("name") == "lname")       error.insertAfter("#lastname");     else       error.insertAfter(element);   },   debug:true })
Onubmit Boolean默認:true 是否提交時驗證	$(".selector").validate({   onsubmit:false })
onfocusout Boolean默認:true  是否在獲取焦點時驗證	$(".selector").validate({   onfocusout:false })
onkeyup Boolean默認:true  是否在敲擊鍵盤時驗證	$(".selector").validate({   onkeyup:false })
onclick Boolean默認:true 是否在鼠標點擊時驗證（一般驗證checkbox,radiobox）	$(".selector").validate({   onclick:false })
focusInvalid Boolean默認:true 提交表單后,未通過驗證的表單(第一個或提交之前獲得焦點的未通過驗證的表單)會獲得焦點	$(".selector").validate({   focusInvalid:false })
focusCleanup Boolean默認:false 當未通過驗證的元素獲得焦點時,并移除錯誤提示（避免和 focusInvalid.一起使用）	$(".selector").validate({   focusCleanup:true })
errorClass String默認:"error" 指定錯誤提示的css類名,能夠自己定義錯誤提示的樣式	$(".selector").validate({   errorClass:"invalid" })
errorElement String默認:"label" 使用什么標簽標記錯誤	$(".selector").validate   errorElement:"em" })
wrapper String 使用什么標簽再把上邊的errorELement包起來	$(".selector").validate({   wrapper:"li" })
errorLabelContainer Selector 把錯誤信息統(tǒng)一放在一個容器里面	$("#myform").validate({   errorLabelContainer:"#messageBox",   wrapper:"li",   submitHandler:function() { alert("Submitted!") } })
showErrors: 跟一個函數(shù),能夠顯示總共同擁有多少個未通過驗證的元素	$(".selector").validate({   showErrors:function(errorMap,errorList) {        $("#summary").html("Your form contains " + this.numberOfInvalids() + " errors,see details below.");        this.defaultShowErrors();   } })
errorPlacement: 跟一個函數(shù),能夠自己定義錯誤放到哪里	$("#myform").validate({  rrorPlacement:function(error,element) { error.appendTo(element.parent("td").next("td"));   },   debug:true   })
success: 要驗證的元素通過驗證后的動作,假設(shè)跟一個字符串,會當做一個css類,也可跟一個函數(shù)	$("#myform").validate({        success:"valid",        submitHandler:function() { alert("Submitted!") } })
highlight: 能夠給未通過驗證的元素加效果,閃爍等

---

2.jqZoom[jqZoom.pack]

A.相關(guān)文檔：

博客園：http://www.rzrgm.cn/kissdodog/archive/2012/12/15/2819887.html

B.相關(guān)實例：

懶人圖庫：http://www.lanrentuku.com/js/tupian-1170.html

jb：http://www.jb51.net/jiaoben/18006.html    ----------------[不確定]

C.資源下載 ---------------暫缺

D:使用教程

1、head區(qū)域引入

<link rel="stylesheet" href="css/jqzoom.css" type="text/css">

2、 引入js庫

<script src="js/jquery.min.js" type="text/javascript"></script>

<script src="js/jqzoom.pack.1.0.1.js" type="text/javascript"></script>

3.html

<div id="content" style="margin-right:auto;margin-left:auto;width:600px;">
<a href="images/shoe2_big.jpg" class="jqzoom" style="" title="圖片標題">
<img src="images/shoe2_small.jpg"  title="圖片標題" style="border: 1px solid #666;">
</a> 
</div>

4、調(diào)用jqzoom函數(shù)庫

<script type="text/javascript">

$(function() {

var options =

{

zoomWidth: 250, //放大鏡的寬度

zoomHeight: 250,//放大鏡的高度

zoomType:'reverse'

};

$(".jqzoom").jqzoom(options);

});

</script>

配置參數(shù)：

zoomType。默認值：’standard’。還有一個值是’reverse’，是否將原圖用半透明圖層遮蓋。

zoomWidth，默認值：200。放大窗體的寬度。

zoomHeight。默認值：200，放大窗體的高度。

xOffset。默認值：10，放大窗體相對于原圖的x軸偏移值，能夠為負。

yOffset，默認值：0。放大窗體相對于原圖的y軸偏移值，能夠為負。

position，默認值：’right’，放大窗體的位置，值還能夠是:’right’ ,’left’ ,’top’ ,’bottom’。

lens，默認值：true，若為false。則不在原圖上顯示鏡頭。

imageOpacity，默認值：0.2，當zoomType的值為’reverse’時。這個參數(shù)用于指定遮罩的透明度。

title。默認值：true，在放大窗體中顯示標題。值能夠為a標記的title值，若無。則為原圖的title值。

showEffect，默認值：’show’，顯示放大窗體時的效果。值能夠為: ‘show’ ,’fadein’。

hideEffect，默認值：’hide’，隱藏放大窗體時的效果: ‘hide’ ,’fadeout’。

fadeinSpeed，默認值：’fast’，放大窗體的漸顯速度(選項: ‘fast’,'slow’,'medium’)。

fadeoutSpeed，默認值：’slow’，放大窗體的漸隱速度(選項: ‘fast’,'slow’,'medium’)。

showPreload，默認值：true，是否顯示載入提示Loading zoom(選項: ‘true’,'false’)。

preloadText，默認值：’Loading zoom’，自己定義載入提示文本。

preloadPosition。默認值：’center’。載入提示的位置，值也能夠為’bycss’，以通過css指定位置。

******************我是切割線~~*********************

第三章. json2.js json格式和字符串的切換

相關(guān)知識：

eval(string) 字符串轉(zhuǎn)json,

JSON.parse(string)字符串轉(zhuǎn)文本，

JSON.stringify(json)   json轉(zhuǎn)字符串

     為傳參

JSON.parse()        JSON.strigify()      在IE瀏覽器低版本號IE6 IE7不支持這兩個方法。所以須要引進來json2.js來做兼容

相關(guān)文檔：

csdn：http://www.rzrgm.cn/william-lin/archive/2012/08/10/2632234.html

下載json2.js：https://github.com/douglascrockford/JSON-js/blob/master/json2.js

//直接聲明json數(shù)據(jù)結(jié)構(gòu)
var myJSONObject = {"bindings": [
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"},
{"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"},
{"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"}
]
};
//聲明字符串,可對照一下json文本與我們正常文本的差別
var normalstring='[{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]';
var jsontext='[{"persons":[{"name":"jordan","sex":"m","age":"40"}, {"name":"bryant","sex":"m","age":"28"}, {"name":"McGrady","sex":"m","age":"27"} ]}]';

//調(diào)用eval函數(shù)轉(zhuǎn)換為json對象，
var myE = eval(normalstring);
document.writeln(myE '<br><br>');
//將json對象轉(zhuǎn)換為字符串
var text = JSON.stringify(myE);
//對照轉(zhuǎn)換后的json文本與聲明的文本差別
document.writeln('轉(zhuǎn)換后的json文本：' text '<br><br>聲明的json格式文本' jsontext '<br><br>聲明的普通格式文本' normalstring '<br><br>');

//當安全比較重要的時候使用JSON解析就好一些。JSON解析僅僅會識別JSON文本而且它更安全,以下調(diào)用json的parse函數(shù)對文本數(shù)據(jù)轉(zhuǎn)換生成json數(shù)據(jù)結(jié)構(gòu)
var myData = JSON.parse(jsontext);
document.writeln(myData '<br><br>');