JS - Приложение

332
11 июня 2017, 20:01

Всем доброго времени суток. В backbone js есть возможность структурировать вид.

var view ={
   events:{
     "click #id_item":'myfun'
   },
   myfun:function(evt){
    console.log('myfun');
   }
}

Как реализовать родителя на чистом js чтобы он понимал данную конструкцию ?

Answer 1

Как-то так:

var view ={ 
   events:{ 
     "click #id_item":'myfun' 
   }, 
   myfun:function(evt){ 
    console.log('myfun'); 
   } 
}; 
 
function setEvents(model){ 
  // Тут всякие проверки, опустим для наглядности 
  Object.keys(model.events).forEach(part => { 
    // Разделяем событие и селектор (т. к. селектор может содержать пробелы, собираем оставшиеся кусочки и склеиваем их) 
    let [eventName, ...selector] = part.split(' '); 
    selector = selector.join(' '); 
     
    let element = document.querySelector(selector); 
     
    // Если по селектору ничего не нашли - выход 
    if(element === null) return; 
     
    // Навешивание слушателя 
    // Довольно странно что методы не лежат в отдельном ключе типа methods 
    element.addEventListener(eventName, model[model.events[part]]); 
  }); 
} 
 
setEvents(view);
<div> 
  <span id='id_item'>Я тут</span><br /> 
  <span id='something'>Это не я</span> 
</div>

READ ALSO
Вызов функции при загрузке

Вызов функции при загрузке

Есть некая функция, точнее часть об общего скрипта, вызываемая при нажатии:

371
Связать результаты &lt;form&gt; с графиком на Google Charts

Связать результаты <form> с графиком на Google Charts

Есть простой график на Google Charts:

258
Проблемы с анимацией формы по нажатию кнопки

Проблемы с анимацией формы по нажатию кнопки

Есть форма, в ней кнопка, которая обрабатывает введенные данные из формыЕсть CSS с анимацией этой формы

430
Почему не работает меню на мобильном разрешении?

Почему не работает меню на мобильном разрешении?

Нашел меню для мобильных версий, скопировал, переименовал классы, стили писал лишь нужные, но почему-то не работает

359