Как я могу сделать preventDefault перед запуском прокси-события?

Question

Задача такая же, как в this post: захватите ссылку на ссылку и запретите поведение браузера по умолчанию. Ответ дается там был:

шаблона:

<a on-click='sayHello' href="#">Activate!</button> 

JS:

ractive.on('sayHello', function (event) { 
    event.original.preventDefault(); 
    alert('Hello world!'); 
}); 

Проблема заключается в том, что обработчик sayHello событие не должен знать о том, что было оригинальное событие. Весь смысл проксирования заключается в том, что обработчик события не должен заботиться о типе исходного события. Например, я меняю ссылку на кнопку, больше нет необходимости в preventDefault.

Итак, мой вопрос заключается в том, как я могу вызвать preventDefault до или после запуска прокси-сервера события.

хорошее решение было бы уволить несколько прокси-серверов событий в строке (если это возможно):

Шаблон:

<a on-click='preventDefault;sayHello' href="#">Activate!</button> 

Js:

ractive.on('preventDefault', function (event) { 
    event.original.preventDefault(); 
}); 
ractive.on('sayHello', function (event) { 
    alert('Hello world!'); 
}); 

Возможно ли это каким-то образом ? Или есть другое приятное решение?

Answer 1

Я решил это таким образом, но я не полностью удовлетворен.

Шаблон:

<a on-click='pd_and:sayHello' href="#">Activate!</button> 

Js:

ractive.on('pd_and', function (event, next) { 
    event.original.preventDefault(); 
    var i = args.indexOf(':'), arg; 
    if (i === -1) { 
    type = next; 
    arg = undefined; 
    } else { 
    type = next.substr(0, i); 
    arg = next.substr(i + 1); 
    } 
    return ractive.fire(type, event, arg); 

}); 

Answer 2

Если ваша цель состоит в том, чтобы инкапсулировать preventDefault между шаблоном и методом, то вы можете свернуть свое собственное событие прокси:

Ractive.events.clickpd = function (node, fire) { 
    node.addEventListener('click', click) 

    function click(e){ 
     e.preventDefault() 
     fire({ 
      node: node, //breaks Ractive if not included 
      original: e //optional 
     }) 
    } 
    return { 
     teardown: function() { 
      node.removeEventListener('click', click) 
     } 
    } 
} 

И используйте его так:

<a on-clickpd='sayGreeting'>{{greeting}}</a> 

См. http://jsfiddle.net/ka2Pu/2/ для полного примера.

Docs на пользовательские события здесь: http://docs.ractivejs.org/latest/ractive-events

Answer 3

Один из подходов может передать аргумент, который определяет, должен ли быть предотвращено по умолчанию:

шаблона:

<a on-click='sayHello:true' href="#">Activate!</a> 
<button on-click='sayHello'>Activate!</button> 

код :

ractive.on('sayHello', function (event, shouldPreventDefault) { 
    if (shouldPreventDefault) { 
    event.original.preventDefault(); 
    } 
    alert('Hello world!'); 
}); 

Или, если вы хотите избежать boolean trap, вы можете сделать ...

<a on-click='sayHello:{preventDefault:true}' href="#">Activate!</a> 

... et cetera.

Цепочки событий - интересная идея. Я не уверен, что это принадлежит в библиотеке, но вы могли бы, конечно, сделать что-то вроде

шаблона:

<a on-click='multiple:["preventDefault","sayHello"]' href='#'>Activate!</a> 

код:

ractive.on('multiple', function (event, sequence) { 
    var eventName, i, len; 

    len = sequence.length; 
    for (i = 0; i < len; i += 1) { 
    this.fire(sequence[i], event); 
    } 
}); 

Эта модель может быть расширена на при необходимости включить аргументы.