Event delegation not working in X-tag

170 Views Asked by babbitt At 16 April 2025 at 14:46

I can't get delegation to work with events. I'm trying to have a certain function fire when a button within the element is pressed. However, when I use the syntax provided ('tap:delegate(button)': function(){});) I get no response. Below is some example code, Some help would be appreciated.

HTML:
<my-tag></my-tag>

Js:
xtag.register('my-tag', {
content: '<span>Some Text</span><button>my button</button>',
events: {
 'tap:delegate(button)': function(){
  console.log('the button was pushed');
}
} 
});

Original Q&A

There are 1 best solutions below

jpec On 18 April 2016 at 21:36

Your code is working for me. Something could be loading out of order. You could try wrapping your code with a WebComponentsReady event handler:

window.addEventListener('WebComponentsReady', function () {
    xtag.register('my-tag', ...);
});

I usually put the script tags at the bottom of the <body> to avoid this.

<body>
  <my-tag></my-tag>

  <script src="lib/x-tag-core.js"></script>
  <script src="components/my-tag.js"></script><!-- xtag.register('my-tag', ...) -->
</body>

Or if you're using something like webpack

// components/my-tag.js

var xtag = require('~lib/x-tag-core.js');

module.exports = xtag.register('my-tag', ...);

Event delegation not working in X-tag

There are 1 best solutions below

Related Questions in JAVASCRIPT

Related Questions in EVENT-DELEGATION

Related Questions in X-TAG

Trending Questions

Popular # Hahtags

Popular Questions