1

我正在使用以下代码，但它不断给我错误：

TypeError: container("accounts").atPosition("#left-top") 未定义

代码是：

function container(name, position) {
    return {
        pos: null,
        atPosition: function(position) {

            $(position).html(this.newContainer());
            //$(position+" .main").html("yes");
            this.pos = position;
        },
        populateData: function(rdata) {
            $("#left-top .main").html(rdata);
        },
        newContainer: function() {
            //alert(this.pos);
            return '<h3>' + name.toTitleCase() + '</h3>\
                <div class="main">\
                </div>';
        }
    };
}

container('accounts').atPosition('#left-top').populateData("yahoo!!!!");​

为什么我会收到此错误，我该如何解决？

4

4 回答 4

7

您应该从函数返回this以进行链接。默认情况下函数返回未定义（如果你不使用new operator）。通过从没有任何返回内容的函数返回 this 将有助于链接。

function container(name, position) {
    return {
        pos: null,
        atPosition: function(position) {
            $(position).html(this.newContainer());
            //$(position+" .main").html("yes");
            this.pos = position;

            return this;
        },
        populateData: function(rdata) {
            $("#left-top .main").html(rdata);
            return this;
        },
        newContainer: function() {
            //alert(this.pos);
            return '<h3>' + name.toTitleCase() + '</h3>\
                <div class="main">\
                </div>';
        }
    };
}​
于 2012-10-24T12:43:41.230 回答
2

您分配给的函数atPosition没有return语句。

所以当你调用时atPosition('#left-top')，你会得到默认的返回值undefined

您需要返回要调用的对象populateData（应该是this）

于 2012-10-24T12:43:46.717 回答
1

函数链接不是一种特殊的 javascript 语法，如果你愿意，你可以用 Java、Python 或任何支持 OOP 的东西来实现它。

a.functionX().functionY()有效，因为functionX()再次返回一个对象，该对象具有一个名为functionY()

在您的情况下，functionX()应该返回调用它的相同对象，因此return this;将解决您的问题

但这不是故事的结局！！！

@Rich S 在他的回答中提到：

为了使链接工作，您需要“返回这个；” 在您要链接的任何功能的末尾。

这不是必需的 true，只要您返回一个对象（或任何对象），链接就会起作用，这是一个示例：

var str ="abc";
var strFromChain = str.replace('a','x').toUpperCase();
// use function chainning
document.write(strFromChain+'\n');
// result should be XBC

var str1 = "abc";
str1.replace('a','x');
var str1NotFromChain = str1.toUpperCase();
// if replace() returned this, str1NotFromChain should also be XBC
document.write(str1NotFromChain)
// but is it???????

显然replace()方法 ofstr没有返回this，而是返回一个具有不同值的新字符串，这很容易理解，因为字符串是不可变的，无论你调用什么方法str，它的值总是"abc".

我只是在这里说明一点，链接方法没有必要返回this，它可以返回一个新对象，如果它愿意。即使在线教程教您this在实现链接函数时使用（即javascript.issexy），您也应始终注意使用第三方库时返回的内容（即 expressjs 中的路由链接）

于 2016-05-16T23:26:36.737 回答
0

链接不会自动发生。

为了使链接工作，您需要“返回这个；” 在您要链接的任何功能的末尾。

实际上，您所做的只是在返回的任何内容上调用该函数。如果你“返回这个；” 然后你会得到一个很好的链接语法，它会影响同一个对象。

鉴于您的问题，jQuery 开发人员指南是获取优质 JavaScript 技巧的好地方，我建议您查看http://docs.jquery.com/Plugins/Authoring#Maintaining_Chainability

于 2012-10-24T12:48:27.933 回答