2

我需要将我构建的一个小画布应用程序合并到一个巨大的 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$)

无论如何,我尝试过的事情都没有成功。我尝试使用$.proxywhich 没有按预期工作(因为这里的上下文是不同的东西......)。

这是我目前卡住的地方:

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)
});

它作为一个简单的测试用例工作,但是当我尝试在我的项目中使用它时,我得到循环引用并且事情出错了。我在这里想念什么?

4

2 回答 2

3

你在做什么$("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

会破坏很多东西!!!Example$("<p/>")不会创建一个元素,因为它被 find() 重载了。基本上你需要重新创建 jQuery 核心函数来获得所有的功能!

于 2013-06-27T19:41:03.807 回答
1

尝试这个

var ctxed$ = function (selector)
{
    return $(selector, '#wrapper-el');
}
(function($){
   $('p').addClass('awesome'); //should only affect elements inside #wrapper-el
})(ctxed$);
于 2013-06-27T19:53:58.260 回答