jQuery的$.proxy()應(yīng)用示例介紹
更新時間：2014年04月03日 15:41:15 作者：
這篇文章主要介紹了jQuery的$.proxy()應(yīng)用,需要的朋友可以參考下
今天在看<<鋒利的jQuery>>時看到了proxy()的使用,感覺很模糊,就到處找資料.
jQuery的源碼也沒看明白.
不過總算明白了proxy的用法了;
<input type="button" value="測試" id="guoBtn" name="我是按鈕的name"/>
var obj = {
name: "我是obj的name",
sayName: function () {
alert(this.name);
}
}
$("#guoBtn").click(obj.sayName); //我是按鈕的name
// 如果我想訪問obj的name怎么辦呢?
$("#guoBtn").click($.proxy(obj.sayName,obj));//"我是obj的name"
$("#guoBtn").click($.proxy(obj, "sayName")); //"我是obj的name"
從上面proxy(a,b)的用法可以看出他的參數(shù)有兩種寫法.
第一種:a是一個function函數(shù),b是這個函數(shù)的對象所有者.
第二種:a是一個對象,b是一個字符串,是a的屬性名.
還有這個實例就是<<鋒利的jQuery>>上的一個例子了.
<div id="panel" style="display:none;">
<button>Close</button>
</div>
$("#panel").fadeIn(function () {
$("#panel button").click(function () {
$(this).fadeOut();
});
});
button雖然消失了,但是panel卻沒有消失.可以使用proxy來解決這個問題.
$("#panel").fadeIn(function () {
var obj = this;
$("#panel button").click($.proxy(function () {
$(this).fadeOut();
}, obj));
});
這樣單擊按鈕之后,panel才會消失.
個人感覺proxy最主要就是用來修改函數(shù)執(zhí)行時的上下文對象的.
是在apply的基礎(chǔ)上做的封裝,所以說proxy就是我們jQuery自己的apply.
jQuery的源碼也沒看明白.
不過總算明白了proxy的用法了;
復(fù)制代碼 代碼如下:
<input type="button" value="測試" id="guoBtn" name="我是按鈕的name"/>
復(fù)制代碼 代碼如下:
var obj = {
name: "我是obj的name",
sayName: function () {
alert(this.name);
}
}
$("#guoBtn").click(obj.sayName); //我是按鈕的name
// 如果我想訪問obj的name怎么辦呢?
$("#guoBtn").click($.proxy(obj.sayName,obj));//"我是obj的name"
$("#guoBtn").click($.proxy(obj, "sayName")); //"我是obj的name"
從上面proxy(a,b)的用法可以看出他的參數(shù)有兩種寫法.
第一種:a是一個function函數(shù),b是這個函數(shù)的對象所有者.
第二種:a是一個對象,b是一個字符串,是a的屬性名.
還有這個實例就是<<鋒利的jQuery>>上的一個例子了.
復(fù)制代碼 代碼如下:
<div id="panel" style="display:none;">
<button>Close</button>
</div>
復(fù)制代碼 代碼如下:
$("#panel").fadeIn(function () {
$("#panel button").click(function () {
$(this).fadeOut();
});
});
button雖然消失了,但是panel卻沒有消失.可以使用proxy來解決這個問題.
復(fù)制代碼 代碼如下:
$("#panel").fadeIn(function () {
var obj = this;
$("#panel button").click($.proxy(function () {
$(this).fadeOut();
}, obj));
});
這樣單擊按鈕之后,panel才會消失.
個人感覺proxy最主要就是用來修改函數(shù)執(zhí)行時的上下文對象的.
是在apply的基礎(chǔ)上做的封裝,所以說proxy就是我們jQuery自己的apply.
相關(guān)文章
這篇文章主要介紹了jQuery實現(xiàn)的簡單拖動層,可實現(xiàn)響應(yīng)鼠標(biāo)拖動div層及動態(tài)顯示坐標(biāo)值的功能,涉及jQuery鼠標(biāo)響應(yīng)及頁面元素屬性相關(guān)操作技巧,需要的朋友可以參考下2017-02-02
easyui下拉框動態(tài)級聯(lián)加載的示例代碼
本篇文章主要介紹了easyui下拉框動態(tài)級聯(lián)加載的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
有時候我們需要判斷當(dāng)前的圖片是否存在，方便后期做一些操作，當(dāng)然也可以參考上一篇文章，如果不存在就替換位默認(rèn)圖片2023-06-06
當(dāng)把鼠標(biāo)移動到盒子上的時候上面就會出現(xiàn)一個黑色的盒子,這是在瀏覽網(wǎng)頁的時候看到的一個效果，具體實現(xiàn)如下，感興趣的朋友可以了解下2013-09-09
jQuery內(nèi)置的AJAX功能和JSON的使用實例
通過jQuery內(nèi)置的AJAX功能，訪問后臺獲得JSON格式的數(shù)據(jù)，然后通過jQuer把數(shù)據(jù)直接在頁面上顯示,需要的朋友可以參考下2014-07-07
這篇文章主要介紹了jQuery Dialog 取消右上角刪除按鈕事件的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-09-09
這兩天突發(fā)奇想，結(jié)果就做了一個jQ的tip插件，形狀就像下面這樣。會隨title的多少改變大小的喲.2010-11-11
這篇文章主要介紹了jQuery實現(xiàn)磁力圖片跟隨效果,結(jié)合完整實例形式分析了jQuery事件響應(yīng)及animate方法實現(xiàn)帶緩沖效果的圖片跟隨效果,需要的朋友可以參考下2016-09-09
用戶登錄是許多網(wǎng)站必備的功能。有一種方式就是不管在網(wǎng)站的哪個頁面，點擊登錄按鈕就會彈出一個遮罩層，顯示用戶登錄的對話框。本文將推薦一個帶二維碼的登錄彈出層，可拖動、關(guān)閉，有需要的朋友可以參考一下。2016-12-12
本文給大家推薦的是一款jQuery實現(xiàn)彈出窗口中切換登錄與注冊表單的特效。適用瀏覽器：IE8+、FireFox、Chrome、Safari、Opera。十分的方便實用，有需要的小伙伴可以參考下。2015-06-06