Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.03.2013, 17:26
2de 2de вне форума
Аспирант
Отправить личное сообщение для 2de Посмотреть профиль Найти все сообщения от 2de
 
Регистрация: 26.10.2010
Сообщений: 78

Правильный контекст this и наследование с помощью prototype
Всем привет!

Решил разобраться с наследованием с помощью prototype и сразу применить на практике. Через некоторое время столкнулся с проблемой следующего характера.

Разметка:

<ul id="tree">
 <li><i></i><a href="menu-add.html">Добавление меню</a></li>
 <li>
  <i></i><a href="phrases.html">Фразы</a>
  <ul><li><i></i><a href="phrases-edit.html">Редактирование</a></li></ul>
 </li>
 ...
</ul>
<script type="text/javascript">
new Tree("menu");
</script>


Скрипт:

function Tree(Element)
{
 if(typeof Element === "string") Element = document.getElementById(Element);

 Element.onclick = this.Click;
}

Tree.prototype.Click = function(E)
{
 E = E || window.event;
 var Target = E.target || E.srcElement;

 if(Target.tagName === "I") здесь нужно вызвать метод Toggle
 else if(Target.tagName === "A") return false;
}

Tree.prototype.Toggle = function(Element)
{
 Element.parentNode.className = Element.parentNode.className === "show" ? "" : "show";
}


В связи с тем что метод Click вызван в контексте елемента страницы то, this указывает на него, а мне нужно вызвать метод Toggle объекта Tree. Как это правильнее всего сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 28.03.2013, 18:01
Аспирант
Отправить личное сообщение для Ervin Посмотреть профиль Найти все сообщения от Ervin
 
Регистрация: 19.03.2013
Сообщений: 84

Добавить -
var that = this;
Element.onclick = that.Click;


в конструктор Tree.
Ответить с цитированием
  #3 (permalink)  
Старый 28.03.2013, 18:25
Аватар для rgl
rgl rgl вне форума
Профессор
Отправить личное сообщение для rgl Посмотреть профиль Найти все сообщения от rgl
 
Регистрация: 28.02.2011
Сообщений: 349

В конструктор Tree:
var that = this;
Element.onclick = function(e) { that.Click.call( that, e ) };

в Click:
if(Target.tagName === "I") this.Toggle(); //здесь нужно вызвать метод Toggle
Ответить с цитированием
  #4 (permalink)  
Старый 28.03.2013, 18:28
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Element.onclick = this.Click.bind(this);

Но это не сработает в старых браузерах (IE6-8 как минимум). Так что изврат:

var Tree = this;
Element.onclick = function(){
    tree.Click.apply(tree, arguments);
}


Кстати кто вас научил писать все имена переменных с большой буквы?
Это тупость полнейшая. Ничего не понятно - где конструктор, где че. Пример выше - Tree - это инстанс или конструктор? Это инстанс, но из-за дебильного именования совпал по имени с конструктором. Да и со встроенными объектами диссонанс получается.
Ответить с цитированием
  #5 (permalink)  
Старый 29.03.2013, 00:58
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,495

VBScript же. =\
Пускай пишет как нравится, если переучиваться лень. Но и пускай знает, что если пойдёт в команду - перекручиваться заставят, перед этим вусмерть затроллив.)
__________________
29375, 35
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
не понимаю как задать правильный контекст loz Dojo toolkit 2 17.02.2011 18:36
Ajax c помощью prototype - что не так? Alive Substance Библиотеки/Тулкиты/Фреймворки 1 01.03.2010 16:51
наследование и prototype js_noob Общие вопросы Javascript 3 01.03.2010 00:32
Prototype v1.4.0 and Prototype v1.5.1_rc3 prihod Prototype & script.aculo.us 2 02.10.2008 16:08
проблема с передачей русского текста в Prototype subaru Prototype & script.aculo.us 2 26.07.2007 16:56