08.10.2011, 22:23
|
Интересующийся
|
|
Регистрация: 29.09.2011
Сообщений: 11
|
|
Скрипт за баксы $$$$$
Кто напишет код добавления удаления событий за баксы?
нужно написать код в таком стиле
var _$$={
$e:{
add:function(elem, type, handler) {
},
remove:function(elem, type, handler) {
}
}
}
var $$e=_$$.$e;
запуск должен осуществляться так
$$e.add(document.getElementById("xxxsss"),'click',function(event) { alert('1');});
вот этот быдлокод http://javascript.ru/tutorial/events/crossbrowser не копировать
-код должен работать во всех браузерах
-события должны выполняться по порядку их добавления
-если одному элементу добавляется несколько одинаковых событий, то все одинаковые должны игнорироваться
-и главное я должен разобраться в коде, поэтому каждая строка с комментарием
Небольшой пример как стиль но не работающий
примерно вот так должно все выглядеть
var _$$={
$e:{
num:0,
dump:{},
add:function (elem, type, handler) {
var can=true;
if(this.dump[type]) {
for(var n in this.dump[type][elem]) {
if(this.dump[type][elem][n]==handler) {
can=false;
}
}
}
if(can) {
if(!this.dump[type]) {
this.dump[type]={};
}
if(!this.dump[type][elem]) {
this.dump[type][elem]={};
}
this.dump[type][elem][this.num]=handler;
this.num++;
var allhandl=function() {
for(var n in _$$.$e.dump[type][elem]) {
_$$.$e.dump[type][elem][n]();
}
}
if (elem.addEventListener) {
elem.addEventListener(type, allhandl, false);
} else if (elem.attachEvent) {
elem.attachEvent('on'+type, allhandl);
}
}
},
del:function (elem, type, handler) {
}
}
}
Кто уверен в своих силах?
Последний раз редактировалось gordon freeman, 08.10.2011 в 22:26.
|
|
08.10.2011, 22:59
|
|
Матрос
|
|
Регистрация: 04.04.2008
Сообщений: 6,246
|
|
сколько платите?
Необходимое более подробное ТЗ, указывающее что именно вам не подходит в том решении, и что необходимо добавить?
|
|
08.10.2011, 23:28
|
Интересующийся
|
|
Регистрация: 29.09.2011
Сообщений: 11
|
|
Сообщение от Gvozd
|
сколько платите?
Необходимое более подробное ТЗ, указывающее что именно вам не подходит в том решении, и что необходимо добавить?
|
10$ - 15$
можно использовать все материалы отсюда
http://javascript.ru/tutorial/events/crossbrowser
функциональность нужна такая же
но только переработать всю эту запуттаность в такой вид
var _$$={
$e:{
add:function(elem, type, handler) {
},
remove:function(elem, type, handler) {
}
}
}
var $$e=_$$.$e;
$$e.add(document.getElementById("xxxsss"),'click',function(event) { alert('1');});
имменно в такой вид
в первую очередь чтобы было понятно мне
код должен работать во всех браузерах как и тот что по ссылке выше
Вот например универсальный код
var _$$={
$e:{
add:function(obj, e, h) {
if (obj.addEventListener) {
obj.addEventListener(e, h, false);
} else if (obj.attachEvent) {
obj.attachEvent('on'+e, h);
}
else {
obj['on'+e]=function() {
h();
};
}
},
del:function(obj, e, h) {
if (obj.removeEventListener) {
obj.removeEventListener(e, h, false);
} else if (obj.detachEvent) {
obj.detachEvent('on'+e, h);
}
else {
obj['on'+e]=null;
}
}
}
}
но тут нельзя назначать новые обработчики к одному и тому же элементу и удалять старые
в том примере что по ссылке создается очень странный dump
elem.events = {
'click' : {
1 : function(e) { alert("Hi!") },
2 : function(e) { alert("I am clicked") }
},
'mouseover' : {
3 : function(e) { alert("Mouse over!") }
}
}
а если допустим я одну и туже функцию назначу в качестве события двум разным элементам... а потом захочу из первого ее удалить?
не уверен что в том коде это прокатит
в общем вот так вот...
|
|
08.10.2011, 23:58
|
|
Матрос
|
|
Регистрация: 04.04.2008
Сообщений: 6,246
|
|
Сообщение от gordon freeman
|
10$ - 15$
|
смешно)
|
|
09.10.2011, 10:14
|
sinistral
|
|
Регистрация: 28.03.2011
Сообщений: 5,418
|
|
задавай вопросы
(function() {
// короткое определение IE
var ie = /*@cc_on@*/0;
//последовательно исполняет все обработчики события для эл-та.
function handleEvent(event) {
// фиксируем событие для IE
if(ie){
event = window.event;
if(!event.target)
event.target = event.srcElement;
event.preventDefault = event.preventDefault || function(){this.returnValue = false}
event.stopPropagation = event.stopPropagaton || function(){this.cancelBubble = true}
// вычислить pageX/pageY
if ( event.pageX == null && event.clientX != null ) {
var html = document.documentElement, body = document.body;
event.pageX = event.clientX + (html && html.scrollLeft || body && body.scrollLeft || 0) - (html.clientLeft || 0);
event.pageY = event.clientY + (html && html.scrollTop || body && body.scrollTop || 0) - (html.clientTop || 0);
}
// записать нажатую кнопку мыши в which для IE
// 1 == левая; 2 == средняя; 3 == правая
if ( !event.which && event.button ) {
event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) ));
}
}
// все обработчики для текущего события
var handlers = this.events[event.type];
// последовательно исполняем их.
for (var i in handlers)
handlers[i].call(this,event);
};
_$$ = {};
_$$.$e = {
add: function(elem, type, handler) {
if (!addEvent.guid) addEvent.guid = 1;
handler.$$guid = addEvent.guid++;
if (!elem.events) elem.events = {};
var handlers = elem.events[type];
if (!handlers) {
handlers = elem.events[type] = {};
if (elem["on" + type]) handlers[0] = elem["on" + type];
}
handlers[handler.$$guid] = handler;
elem["on" + type] = handleEvent;
},
remove: function(elem, type, handler) {
if (elem.events && elem.events[type]) {
delete elem.events[type][handler.$$guid];
}
}
};
})();
_$$.$e.add( document.body, 'click', function(){alert('clicked')})
_$$.$e.add( document.body, 'click', function(){alert('clicked two times')})
_$$.$e.add( document.body, 'click', function(){alert('имя тега ?\n'+this.tagName)})
|
|
09.10.2011, 21:04
|
Интересующийся
|
|
Регистрация: 29.09.2011
Сообщений: 11
|
|
melky что то он не работает...
причем ошбка таже что и у меня, когда я пытался написать его сам
<html>
<head>
</head>
<body>
<script type="text/javascript">
(function() {
// короткое определение IE
var ie = /*@cc_on@*/0;
//последовательно исполняет все обработчики события для эл-та.
function handleEvent(event) {
// фиксируем событие для IE
if(ie){
event = window.event;
if(!event.target)
event.target = event.srcElement;
event.preventDefault = event.preventDefault || function(){this.returnValue = false}
event.stopPropagation = event.stopPropagaton || function(){this.cancelBubble = true}
// вычислить pageX/pageY
if ( event.pageX == null && event.clientX != null ) {
var html = document.documentElement, body = document.body;
event.pageX = event.clientX + (html && html.scrollLeft || body && body.scrollLeft || 0) - (html.clientLeft || 0);
event.pageY = event.clientY + (html && html.scrollTop || body && body.scrollTop || 0) - (html.clientTop || 0);
}
// записать нажатую кнопку мыши в which для IE
// 1 == левая; 2 == средняя; 3 == правая
if ( !event.which && event.button ) {
event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) ));
}
}
// все обработчики для текущего события
var handlers = this.events[event.type];
// последовательно исполняем их.
for (var i in handlers)
handlers[i].call(this,event);
};
_$$ = {};
_$$.$e = {
add: function(elem, type, handler) {
if (!addEvent.guid) addEvent.guid = 1;
handler.$$guid = addEvent.guid++;
if (!elem.events) elem.events = {};
var handlers = elem.events[type];
if (!handlers) {
handlers = elem.events[type] = {};
if (elem["on" + type]) handlers[0] = elem["on" + type];
}
handlers[handler.$$guid] = handler;
elem["on" + type] = handleEvent;
},
remove: function(elem, type, handler) {
if (elem.events && elem.events[type]) {
delete elem.events[type][handler.$$guid];
}
}
};
})();
_$$.$e.add( document.body, 'click', function(){alert('clicked')})
_$$.$e.add( document.body, 'click', function(){alert('clicked two times')})
_$$.$e.add( document.body, 'click', function(){alert('имя тега ?\n'+this.tagName)})
</script>
</body>
</html>
IE
addEvent - определение отсутсвует
строка 56 символ 14
Файрфокс
консоль ошибок вся забита
В общем задание уже выполнено
Вот что я хотел увидеть
<html>
<head>
</head>
<body>
<input type="button" id="asd">
<input type="button" id="asd2">
<script type="text/javascript">
var _$$={
$e:{
add:function(elem, type, handler) {
// проверка на свойство у обьекта
if(elem.event_list==undefined) elem.event_list = {};
if(elem.event_list[type]==undefined) elem.event_list[type] = [];
// ищем есть ли уже данная функция
var list = elem.event_list[type];
var exist = false;
for(var i in list){
if(list[i]==handler) exist = true;
}
// если не найдена то добавляем
if(!exist){
// доабвляем в общий список функций
elem.event_list[type].push(handler);
// добавляем обработчки событий
elem['on'+type] = function(event){
var event = event||window.event;
// вызываем все функции в списке
var list = this.event_list[type];
for(var i in list){
list[i](event);
}
}
}
},
remove:function(elem, type, handler) {
// если нет функций для данного события то возращаем false
if(elem.event_list==undefined) return false;
if(elem.event_list[type]==undefined) return false;
// ищем искомую функцию
var list = elem.event_list[type];
for(var i in list){
if(list[i]==handler){
// если нашли то удаляем и возращаем true
list = list.splice(i,1);
return true;
}
}
return false;
}
}
}
// Тестим
var $$e=_$$.$e;
var e1 = function(event){alert(1);}
var e2 = function(event){alert(2);}
var e3 = function(event){alert(3);}
// два раза добавляем e1, второе добавление не добавиться
$$e.add(document.getElementById('asd'),'click',e1);
$$e.add(document.getElementById('asd'),'click',e1);
$$e.add(document.getElementById('asd'),'click',e2);
// добавляем и удаляем событие e3
$$e.add(document.getElementById('asd2'),'click',e1);
$$e.add(document.getElementById('asd2'),'click',e3);
$$e.remove(document.getElementById('asd2'),'click',e3);
</script>
</body>
</html>
|
|
|
|