我可以複製$，以便在創建jQuery對象時始終使用上下文嗎？

我需要將我構建的一個小畫布應用程序合併到一個Sharepoint站點的巨大混亂中，我無法控制任何東西，所有內容。該應用將進入「WebPart」包裝div。爲了讓我的JS更加美觀和整潔，我想我可以使用一個克隆版本的jQuery，它總是使用我的包裝對象作爲上下文，這樣我就可以確保我永遠不會選擇和改變我的包裝外的任何東西，比如：

var ctxed$ = ctxjQuery('#wrapper-el'); //this is what I don't get 

(function($){ 
    $('p').addClass('awesome'); //should only affect elements inside #wrapper-el 
})(ctxed$)

無論如何，我試過的東西沒有解決。我嘗試使用$.proxy，這並沒有像我期望的那樣工作（因爲上下文在這裏是不同的東西......）。

這是我停留在目前的點：

function getContextifiedjQuery(ctx) { 

    var fn = function() { 

     return $.call(arguments[0], ctx); 
    } 

    $.each($, function (k, v) { 
     fn[k] = v; 
    }); 

    return fn; 

} 

var wrapper$ = getContextifiedjQuery('#wrapper'); 

wrapper$('p').css('color', 'red'); 
wrapper$.each([1, 2, 3], function() { 
    alert(this) 
});

它可以作爲一個簡單的測試案例，但是當我嘗試在我的項目中使用它，我得到循環引用，事情出差錯。我在這裏失蹤的是什麼？

來源

2013-06-27 m90

你所用$("p")做的基本上是

ctxjQuery('#wrapper-el')('p')

如果你想工作過的背景下，將

(function($){ 
    $.find('p').addClass('awesome'); //should only affect elements inside #wrapper-el 
})(ctxed$)

如果你想寫的包裝，它會看起來像這個，但它只會支持find（）。它會覆蓋其他的一切。

function ctxjQuery(context) { 
    return function (selector) { 
     return $(context).find(selector); 
    } 
} 

var ctxed$ = ctxjQuery('#wrapper-el'); //this is what I don't get 

(function ($) { 
    $('p').addClass('awesome'); //should only affect elements inside #wrapper-el 
})(ctxed$)

JSFiddle

，再次思考它，你可以做這樣的事情：

function ctxjQuery(context) { 
    var fnc = function(selector){ return $(context).find(selector); }; 
    var $Fnc = $.extend(fnc, $); 
    return $Fnc;  
} 

var ctxed$ = ctxjQuery('#wrapper-el'); //this is what I don't get 

(function ($) { 
    console.log($.each); 
    $('p').addClass('awesome'); //should only affect elements inside #wrapper-el 
})(ctxed$)

JSFiddle

它將打破了很多東西！示例$("<p/>")將不會創建元素，因爲它被find（）重載。基本上你需要重新創建jQuery核心函數來獲得所有的功能！

來源

2013-06-27 19:41:03 epascarello

感謝澄清，但我也將此到我的情況，我贊成不改變瓶蓋內的代碼？ – m90

@ m90更新了我的答案，向您展示瞭如何讓自己的想法奏效，但它會覆蓋其他所有內容。 – epascarello

感謝您的編輯，我現在終於得到您的答案:)發現會沒問題，唯一缺少的將是'$ .each'，我可以像我的初始方法那樣複製它（然後迭代$和copy內容）？請參閱：http://jsfiddle.net/SpGv2/2/ – m90

試試這個

var ctxed$ = function (selector) 
{ 
    return $(selector, '#wrapper-el'); 
} 
(function($){ 
    $('p').addClass('awesome'); //should only affect elements inside #wrapper-el 
})(ctxed$);

來源

2013-06-27 19:53:58

我可以複製$，以便在創建jQuery對象時始終使用上下文嗎？

回答

相關問題