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中的錯誤不是函數

回答

相關問題