模態框:開啟乙個彈框 不關閉它就不能做框外的操作 必須關閉或彈出另外的彈框
載入延遲loading + 進度條只要有請求 就處理一下監控ajax 全域性事件jquery:
$('#box').ajaxstart() //開始 多個ajax共享乙個start
$('#box').ajaxsend()//
傳送$('#box').ajaxsuccess()//
成功$('#box').ajaxcomplete()//
完成$('#box').ajaxerror() //
完成後有錯誤
$('#box').ajaxstop()//
停止 多個ajax共享乙個stop
nprogress :
進度條引入 css js
nprogress.start()啟動
nprogress.done() 關閉
一般配合.ajaxstart() / .ajaxstop() 使用
基於jquery的表單外掛程式 :
jquery-form
每個表單都要有name屬性!!!自動封裝表單資料
$('表單元素').ajaxsubmit(options)//形參和ajax一樣
//表單data不用新增 會自動提交
表單驗證jquery.validate
//自定義屬性
data-required//必填 禁止提交空
data-pattern="/^\d+$/" //
禁止提交數字以外的字串
data-describedby='for_name'data-description='name' //
匹配描述錯誤資訊 多個文字框可以共用
data-conditional = "f1 f2 f3 ">
提示錯誤資訊$(表單元素).vakidate(,
f2:function
(),f2:
function
() description:
}})
基於bootstrap的時間選擇器
bootstarp-datepicker
一.樣式控制
//自定義屬性
// 日期格式
data-provide='datepicker'data-date-format="yy-mm-dd"data-date-language="zh-cn"//
語言有乙個檔案 locales 很多壓縮的js 中文為 zh-cn.js
二.js 控制
$('表單元素').datepicker()
location.search //可獲取 url '?'後面的引數包括'?'
bootcdn 裡面的外掛程式上傳/
頭像/ 檔案
事件委託this 指向會改變為真正用到事件的物件
外掛程式:1. webuploader
html
<div
id="uploader"
class
="wu-example"
>
<
div
id="thelist"
class
="uploader-list"
>
div>
<
div
class
="btns"
>
<
div
id="picker"
>選擇檔案
div>
<
button
id="ctlbtn"
class
="btn btn-default"
>開始上傳
button
>
div>
div>
js
1//js
2var uploader =webuploader.create();
2./uploaderify
一,
二,
var form = document.form ;var fd = new formdata(form);
var xhr=new xmlhttprequest();xhr.open("post","後台路徑")xhr.send(fd); 傳遞了所有資料(包含了其他文字)
三,
var fd =new formdata(form);$.ajax()
jq 外掛程式寫法
1.一次宣告乙個函式 fn.函式名 function options fn.red function options var settings extend defaults,options this.css settings return this 2.一次宣告多個函式 fn.extend fn....
JQ 日期聯動外掛程式
jquery date selector plugin 日期聯動選擇外掛程式 demo calendar dateselector html 年 月 日 function fn.dateselector function options 初始化 this.options for var proper...
jq的外掛程式的寫法
兩種方式 方法一 extend extend src 將src合併到全域性物件中去 使用方式 var i add 3,2 方法二 fn.extend jquery.fn jquery.prototype 也就是jquery物件的原型 fn.extend src 方法將src合併到jquery的例項物...