Необходимо написать небольшой редактор через desigmMode.
Необходимо отслеживать нажатие кнопок(картинок), прикрепляю обработчики через addEventListener но не работает. FireBug никаких сообщений об ошибке не выдает.
Вот исходниый код:
Код:
function jsEditor(name, content, height, width)
{
this.name = name;
this.content = content;
this.height = height;
this.width = width;
this.create();
}
jsEditor.prototype = {
executeAction : function()
{
var div = document.getElementById("msg");
div.innerHTML = "asdasdasd";
},
createToolbarFromArray : function(arrayToolbar)
{
var toolbar = document.createElement("div");
for (i in arrayToolbar)
{
var image = document.createElement("img");
image.setAttribute("id", arrayToolbar[i][1] + "-button");
image.setAttribute("src", "styles/img/jseditor/" + arrayToolbar[i][2]);
image.addEventListener("click", this.executeAction, false); // прикрепляем обработчик
toolbar.appendChild(image);
}
return toolbar;
},
createToolbar : function()
{
var arrayFontStyleToolbar =
[
['Калын', 'Bold', 'bold.png'],
['Курсив', 'Italic', 'italic.png'],
['Подчеркнытый', 'Underline', 'underline.png'],
['Перечеркнутый', 'StrikeThrough', 'strike-through.png']
];
var arrayAdditionalToolbar =
[
['Рәсем куярга', 'InsertImage', 'insert-image.png']
];
return this.createToolbarFromArray(arrayFontStyleToolbar);
},
create : function()
{
var table = document.createElement("table");
table.setAttribute("id", this.name + "-conteiner");
var rowToolbar = table.insertRow(0);
var cellToolbar = rowToolbar.insertCell(0);
cellToolbar.appendChild(this.createToolbar());
var conteiner = document.createElement("div");
conteiner.appendChild(table);
document.open();
document.write(conteiner.innerHTML);
document.close();
}
}Где ошибка не могу понять
Всем заранее спасибо!
подозреваю, что в месте вызова this. уже е тот объект.
попробуйте:
Выводит ошибку :
Код:
uncaught exception: [Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: file:///home/almaz/proj/jseditor/jseditor.js :: anonymous :: line 27" data: no]
Даже так не помогает
lycan
а create кто будет вызывать? 
может быть лучше написать с использованием класса?
Так он же вызывается
Если ты о том.
lycan
он вызывается при создании обьекта, но когда вызывается обработчик этого объекта (там уже наверное оверлей другой), jsEditor - не инициализирован.
тогда уж лучше вынести обработчик за пределы jsEditor, либо сделать так:
Код:
image.addEventListener("click", document.getElementById("msg")innerHTML = "asdasdasd";, false);Вышеуказанным методом не получается, выводит ту же ошибку NS_ERROR_XPC_BAD_CONVERT_JS, и обработчик я выносил за пределы jsEditor, не помогает.
lycan
Код:
image.addEventListener("click", function() {
document.getElementById("msg")innerHTML = "asdasdasd";
}, false);не работает, даже так :
Код:
image.onclick = function() {
document.getElementById("msg").innerHTML = "asdasdasd";
};lycan
а если вместо
что нибудь типа
попробовать? вроде всё правильно...
Глухо
Добавлено Пнд 13 Авг 2007 14:47:12 :
Решилось для
Код:
<script type="text/javascript">
function TFoo() {
}
TFoo.prototype = {
init : function()
{
var div = document.body;
div.addEventListener("click", TFoo.prototype.load, false);
},
load : function()
{
alert("hello");
}
};
foo = new TFoo();
foo.init();
</script>пашет скомпоную под неё. Спасибо!!!
Рещил проблема была в
заменил на
lycan
Не очень правильное решение. Работать будет только одна кнопка, this будет указывать не на экземпляр jsEditor. Здесь нужен bind.
Да действительно работает толко одна кнопка. Здесь http://xpoint.ru/know-how/JavaScript/Po … DlyaCallba приведен пример передачи одного параметра, как можно реализовать передачу двух или болле, пробовал так
Код:
jsEditor.prototype = {
executeAction : function(action)
{
alert("instance : " + this.name + ", action : " + action);
},
createToolbarFromArray : function(toolbarCell, arrayToolbar)
{
var instanceName = this.name;
for (i in arrayToolbar)
{
var image = document.createElement("img");
image.setAttribute("src", jsEditorPathImg + arrayToolbar[i][2]);
image.setAttribute("class", "jseditor-button");
image.onclick = function(action)
{
this.executeAction(action);
}.bind(this, arrayToolbar[i][1]);
image.onmouseover = function()
{
this.id = "js-button-selected";
}
image.onmouseout = function()
{
this.id = "";
}
toolbarCell.appendChild(image);
}
},
.........................alert выдает : "instance : js_editor, action : [object MouseEvent]
Добавлено Втр 14 Авг 2007 16:50:48 :
Все получилось: вместо this создал новый объект и передал его bind().
Спасибо!!
...Здесь http://xpoint.ru/know-how/JavaScript/Po … DlyaCallba приведен пример передачи одного параметра, как можно реализовать передачу двух или болле...
Под передачей параметра там имеется в виду установка нужного значения this, а не передача аргументов. executeAction - это обработчик события, он должен по передаваемому ему в качестве аргумент событию разбираться, что делать дальше.
...Все получилось: вместо this создал новый объект и передал его bind().
Я надеюсь, не класса jsEditor. И куда теперь указывает this в executeAction ? - в этот самый новый объект. Насколько я понимаю, требовалось, чтобы this указывал на экземпляр jsEditor, который ставил обработчик.
Добавлено Срд 15 Авг 2007 15:15:59 :
Вот для иллюстрации обоих с моей точки зрения неправильностей: http://pastebin.mozilla-russia.org/90016, http://pastebin.mozilla-russia.org/90017
Anton
Не очень красиво но заработало
Код:
image.onclick = function()
{
this["instance"].executeAction(this["action"]);
}.bind(new myObject({ instance : this, action : arrayToolbar[i][1] }));...заработало
Это понятно. Просто, помнится, хотелся указатель на другой объект, а сейчас вместо "чистого" this'а this.instance.
Нашёл сегодня здесь: http://developer.mozilla.org/en/docs/Co … od_binding ещё один способ получения правильного this в обработчиках событий. Надо, чтобы объект реализовал интерфейс EventListener, т. е., просто надо объекту добавить метод handleEvent:
Код:
var obj =
{
...
handleEvent: function (event)
{
...
},
...
};
window. addEventListener ("...", obj, ...);