我添加了三个按钮并使用单个类进行管理。但是我得到了这个未定义的错误。
var jQuery = jQuery.noConflict();
jQuery(function(){
var sampTool = new loadToolBar('pageContent');
sampTool.addImgBtn("fontMore","img/plus.png"); // Uncaught TypeError: undefined is not a function
sampTool.addImgBtn("fontLess","img/minus.png");
sampTool.addImgBtn("printPage","img/printer.png");
jQuery('#fontMore').click(function(){
sampTool.zoom('pageContent','+=2px');
});
jQuery('#fontLess').click(function(){
sampTool.zoom('pageContent','-=2px');
});
function loadToolBar(fileBody) // Class definition
{
var toolBar = document.createElement("div");
toolBar.className = "oasys-toolbar";
toolBar.id = "oasys-toolbar";
jQuery(toolBar).insertBefore("#"+fileBody);
}
/*--------------------- Prototypes------------------------*/
loadToolBar.prototype.addImgBtn = function(itemID,itemPath)
{
var newIcon = document.createElement("img");
newIcon.id=itemID;
newIcon.src = itemPath;
newIcon.className = "oasys-toolbar-item oasys-toolbar-btn";
document.getElementById('oasys-toolbar').appendChild(newIcon);
}
loadToolBar.prototype.zoom = function(containerID,size)
{
jQuery("#"+containerID+" *").css("font-size",size);
}
});
提前致谢
答案 0 :(得分:2)
在代码中创建对象时,未定义函数。尝试重新排序,
var jQuery = jQuery.noConflict();
jQuery(function(){
function loadToolBar(fileBody) // Class definition
{
var toolBar = document.createElement("div");
toolBar.className = "oasys-toolbar";
toolBar.id = "oasys-toolbar";
jQuery(toolBar).insertBefore("#"+fileBody);
}
/*--------------------- Prototypes------------------------*/
loadToolBar.prototype.addImgBtn = function(itemID,itemPath)
{
var newIcon = document.createElement("img");
newIcon.id=itemID;
newIcon.src = itemPath;
newIcon.className = "oasys-toolbar-item oasys-toolbar-btn";
document.getElementById('oasys-toolbar').appendChild(newIcon);
}
loadToolBar.prototype.zoom = function(containerID,size)
{
jQuery("#"+containerID+" *").css("font-size",size);
}
var sampTool = new loadToolBar('pageContent');
sampTool.addImgBtn("fontMore","img/plus.png"); // Uncaught TypeError: undefined is not a function
sampTool.addImgBtn("fontLess","img/minus.png");
sampTool.addImgBtn("printPage","img/printer.png");
jQuery('#fontMore').click(function(){
sampTool.zoom('pageContent','+=2px');
});
jQuery('#fontLess').click(function(){
sampTool.zoom('pageContent','-=2px');
});
});
答案 1 :(得分:2)
当您致电loadToolBar.addImgBtn()
时,该功能addImgBtn
尚未分配给loadToolBar.prototype
。
您需要运行类声明然后执行它。我会这样写:
var jQuery = jQuery.noConflict();
function loadToolBar(fileBody) // Class definition
{
var toolBar = document.createElement("div");
toolBar.className = "oasys-toolbar";
toolBar.id = "oasys-toolbar";
jQuery(toolBar).insertBefore("#" + fileBody);
}
/*--------------------- Prototypes------------------------*/
loadToolBar.prototype.addImgBtn = function(itemID, itemPath) {
var newIcon = document.createElement("img");
newIcon.id = itemID;
newIcon.src = itemPath;
newIcon.className = "oasys-toolbar-item oasys-toolbar-btn";
document.getElementById('oasys-toolbar').appendChild(newIcon);
};
loadToolBar.prototype.zoom = function(containerID, size) {
jQuery("#" + containerID + " *").css("font-size", size);
};
jQuery(function() {
// This function runs after `document.ready`. But your constrator don't need to declare after dom ready
var sampTool = new loadToolBar('pageContent');
sampTool.addImgBtn("fontMore", "img/plus.png"); // Uncaught TypeError: undefined is not a function
sampTool.addImgBtn("fontLess", "img/minus.png");
sampTool.addImgBtn("printPage", "img/printer.png");
jQuery('#fontMore').click(function() {
sampTool.zoom('pageContent', '+=2px');
});
jQuery('#fontLess').click(function() {
sampTool.zoom('pageContent', '-=2px');
});
});
答案 2 :(得分:0)
正如Xlander写的那样尝试在onload函数之外移动类定义和原型,或者在尝试使用它们之前将它们放在代码中。