[英]Javascript Adding function to custom elements in the shadow root
I'm writing an app using shadow root, I found my self using shadow.children[i].addEventListener('click', fn);
我正在使用Shadow root编写应用程序,我使用
shadow.children[i].addEventListener('click', fn);
找到了自己shadow.children[i].addEventListener('click', fn);
so much, so I tried to create a custom function to shorthand it, so I wrote: 这么多,所以我试图创建一个自定义函数来简化它,所以我写道:
var $shadow = function(shadow, el, fn){
console.log(shadow);
console.log(el);
var children = shadow.children;
for (var i = 0; i < children.length; i++) {
var child = children[i];
console.log('child '+child.id+', el '+el);
if (child.id === el) {
console.log('match');
return shadow.children[i].addEventListener('click', fn);
break;
}
}
}
and calling it from the custom element as; 然后从custom元素中调用它;
$shadow(shadow, 'd', alert('yap!'));
the problem is the function executed directly once the element is called, and not waiting to "listen" to a "click" action on the specified element. 问题在于,一旦调用元素,该函数将直接执行,而不是等待对指定元素进行“监听”操作。
any thought how to fix it? 任何想法如何解决?
var $shadow = function(shadow, el, fn){
console.log(shadow);
console.log(el);
var children = shadow.children;
console.log(children.length);
for (var i = 0; i < children.length; i++) {
var child = children[i];
console.log(children[i]);
console.log('child '+child.id+', el '+el);
if (child.id === el) {
console.log('match');
return shadow.children[i].addEventListener('click', function(){
console.log(fn);
fn();
});
break;
}
}
}
$shadow(shadow, 'd', function(){alert("yap");});
I understand you want to do at this adress.. 我了解您想以此地址进行。
[http://jsfiddle.net/p4fcoftL/]
I hope you find the job 我希望你找到工作
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.