javascript：object中的错误不是函数

当我在下面运行我的代码时，它在控制台中显示错误object is not a function。此错误位于我的script.js文件的此行var todo = new Todo('contents');中。我怎样才能使它工作？javascript：object中的错误不是函数

这里是我的todo.js文件

var Todo = (function(c) { 
var contents = $('.' + c); 

var showel = function (d) { 
    contents.prepend(d); 
}, 

add = function (name) { 
    if(name != "") { 
     var div = $('<div class="names"></div>') 
     .append('<span>' + name + '</span>') 
     .append("<button class='update' class='update'>Edit</button>") 
     .append("<button class='remove' name='remove'>Remove</button>"); 
    } 

    return showel(div); 
}, 

addUpdateField = function (dom) { 
    var name = dom.parent().find('span').text(), 
     field = $('<input type="text" value="' + name + '" />'), 
     update = $('<button class="updateBtn">Update</button>'); 
    dom.parent().html('').append(field).append(update); 

    return; 
}, 

update = function(el) { 
    var val = el.parent().find('input').val(); 
    el.parent().html('<span>' + val + '</span>') 
    .append('<button class="update" class="update">Edit</button>') 
    .append('<button class="remove" class="remove">Remove</button>'); 

    return; 
}, 

remove = function (el) { 
    return el.remove(); 
}; 

return { 
    add    : add, 
    update   : update, 
    remove   : remove, 
    addUpdateField : addUpdateField 
}; 
})();

这里是我的script.js文件

$(function() { 
var todo = new Todo('contents'); 

$('.addBtn').on('click', function() { 
    var name = $(this).parent().find('input[type="text"]').val(); 
    todo.add(name); 
}); 

$('.contents').on('click', '.remove', function() { 
    var el = $(this).parent(); 
    todo.remove(el); 
}); 

$('.contents').on('click', '.update', function() { 
    var dom = $(this); 
    todo.addUpdateField(dom); 
}); 

$('.contents').on('click', '.updateBtn', function() { 
    var el = $(this); 
    todo.update(el); 
}); 

});

这里是HTML代码

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"> </script> 
<script type="text/javascript" src="todo.js"></script> 
<script type="text/javascript" src="script.js"></script> 
<link rel="stylesheet" type="text/css" href="styles.css"> 
<title></title> 
</head> 

<body> 
<div class="container"> 
    <label>Name</label> 
    <input type="text" class="name" name="name" /> 
    <input type="button" class="addBtn" name="add" value="Add" /> 
    <div class="contents"></div> 
</div> 
</body> 
</html>

来源

2012-08-14 2619

请给你的html文件 – 2012-08-14 11:46:03

我认为你应该将ASEF改为正常功能 – 2012-08-14 11:48:04

ASEF是什么意思？ – 2619 2012-08-14 11:49:34

您立即执行功能被分配到Todo。该函数返回一个对象，所以Todo引用返回的对象，而不是一个函数（因此“不是函数”错误）。

我假设你打算沿着此线的东西：现在

var Todo = function() { 

    this.add = function() { //Note the use of `this` here 
     //Do stuff 
    }; 
    //etc... 

}; //No self-invoking parentheses here

，Todo是指一个构造函数，你可以用new运营商调用，因为你正在尝试做的。

另请注意，此模式将导致每个Todo的实例都具有每个方法的单独副本，效率不高。这将是更好的申报方法作为prototype的性质：现在

var Todo = function() { 
    //Initialize the Todo instance 
}; 
Todo.prototype.add = function() { 
    //Do stuff 
};

的Todo所有实例将共享的方法的一个副本。

来源

2012-08-14 11:49:45

它的工作原理是这样的。但是我想修改我的代码，以便在我上面的示例中按照我尝试的方式工作。我怎样才能修改我的代码，使其工作。 – 2619 2012-08-14 11:52:52

我没有得到你想要达到的目标......把它变成这样的有什么不对？ – 2012-08-14 11:55:11

我正在学习这个javascript。 – 2619 2012-08-14 11:55:56

javascript：object中的错误不是函数

回答

相关问题