2014-02-17 5 views
0

У меня есть установка теоретически, как это [см скрипку ->http://jsfiddle.net/GeZyw/]:Поймайте Javascript CustomEvent по JQuery на() с сохранением пользовательских свойств на первый «уровень»

var EventTest = function(element) { 
    this.element = element; 
    this.element.addEventListener('click', elementClick); 

    function elementClick() { 
     var event = document.createEvent('CustomEvent'); 
     event.initEvent('myevent', false, false); 
     event['xyz']='abc'; 
     event.customData='test'; 
     console.log(event); 
     this.dispatchEvent(event); 
    } 
} 

var element = document.getElementById('test'); 
var test = new EventTest(element); 

$(document).ready(function() { 
    $("#test").on('myevent', function(e) { 
     console.log('myevent', e); 
    }); 
}); 

То, что я хочу, чтобы создать CustomEvent в чистом javascript, обогатите его некоторыми свойствами и активируйте это событие, чтобы его можно было схватить также библиотекой, например jQuery.

Как вы можете видеть в скрипке, CustomEvent запускается хорошо и на самом деле заполняется пользовательскими свойствами - но когда он достигает jQuery on(), пользовательские свойства ушли с первого уровня. Мои пользовательские свойства теперь понижены до e.originalEvent.xyz и так далее.

Это не очень хорошо. Я хочу, чтобы по крайней мере мои собственные свойства были на первом уровне.

Также, в идеальном мире, я хотел бы избавиться от большинства стандартных свойств в посланном случае, так оно содержало (теоретически оптимальный):

e = { 
    xyz : 'abc', 
    customData : 'test' 
} 

Возможен ли это вообще ? Если да, как мне это сделать?

+1

Почему в downvote? – davidkonrad

ответ

1

Я столкнулся с той же проблемой, пару месяцев назад, дело:

Когда событие получено JQuery, нормализует свойства событий, прежде чем он отправляет событие зарегистрированных обработчиков событий.

, а также:

обработчики событий не будут получать исходное событие. Вместо этого они получают новый объект jQuery.Event со свойствами, скопированными из необработанного события HTML.

Почему JQuery делает это:

, потому что он не может устанавливать свойства исходного HTML-события.

я решил сделать то же самое, я начал делать это с противным образом, и мой код в итоге так грязно, в конце концов, я решил использовать решение jQuery.trigger, и передать свой объект события, как вторые пары, как:

$("#test").bind("myevent", function(e, myeventobj) { 
    alert(myeventobj.xyz); 
}); 
var myobj = {"xyz":"abc"}; 
$("#test").trigger("myevent", myobj); 

для получения дополнительной информации проверить эту ссылку из: .trigger()

+0

+1. У меня это есть у меня в голове. Но я хочу избежать ** любого ** использования jQuery из моего кода, поэтому 'trigger' действительно не вариант. Я хочу сделать это «проще» **, если ** вы позже поймаете событие (ы) jQuery. – davidkonrad

+0

Я даю вам принятый ответ. Теперь осознание этого было непростым вопросом. Я прошел через код jQuery, и я ничего не могу сделать. И все это не имеет значения, я просто хотел «чистых» eventData, своего рода гибрид, но что за черт. Я не использую 'trigger'-метод, как вы предложили, потому что я стараюсь избегать jQuery, но вы объяснили то, что я раньше не знал. – davidkonrad