我如何从HTML元素中引发自定义事件？

Question

目前我使用这样的代码

// Create the event. 
var event = document.createEvent('Event'); 

// Define that the event name is 'swiping'. 
event.initEvent('swiping', true, true); 

// Listen for the event. 
elem.addEventListener('swiping', function (e) { 
    // e.target matches elem 
}, false); 

// target can be any Element or other EventTarget. 
elem.dispatchEvent(event); 

处理单元刷卡

我怎么火从HTML元素此活动？ （如<div on-swiping="function-name"></div> OR PolymerJS自定义元素的事件on-click，on-tap等）

Answer 1

关键elem.dispatchEvent(event);

您可以定义使用elem.addEventListener('build', function (e) {

当用户click（或tab）你触发事件中使用自定义事件elem.dispatchEvent(event);

并全面演示是：

var elem = document.querySelector('#test'); 
 

 
// Listen for the event. 
 
elem.addEventListener('build', function (e) { 
 
    alert(elem.innerText); 
 
}, false); 
 

 
document.querySelector('button').onclick = function() { 
 
    var event = new Event('build'); 
 
    // Dispatch the event. 
 
    elem.dispatchEvent(event); 
 
};

<div id="test">test</div> 
 
<button>Buttons</button>

Mozila docs

jsbin