[英]Rx.Observable.fromEvent(document, 'click') Vs. document.addEventListener('click', callback)
[英]How to setup Rx.Observable.fromEvent to work with jQuery filtered events
Rx.Observable.fromEvent(element, eventName)
有很多示例, Rx.Observable.fromEvent(element, eventName)
示例使用jquery选择作为捕获事件的元素。 但是,Rx是否有可能仅使用jQuery筛选的事件设置来侦听事件?
//Bind the event on body but only respond to events that match the filter
$('body').on('click', '.aClass div .something', function () {...});
//Bind to 'body' but only respond to events from the binding above
Rx.Observable.fromEvent(/*something here?*/);
我想出了一些实际上相似的东西,但是看起来比jquery过滤器要昂贵得多。
Rx.Observable.fromEvent($('body'), 'click')
.filter(function (e) {
return $(e.target).is('.aClass div .something');
})
.subscribe(function () {...});
有什么办法可以将jQuery绑定转换为发射器,并在Rx中使用该事件流? 最好的方法是什么?
看到http://jsfiddle.net/ktzk1bh3/2/
HTML:
<div class="aClass">
<div>
<a class="something">Click me</a>
</div>
</div>
Javascript:
//Bind to 'body' but only respond to events from the binding above
var source = Rx.Observable.create(function(o) {
$('body').on('click', '.aClass div .something', function(ev) {
o.onNext(ev);
})
});
var sub = source.subscribe(function(ev) { console.log("click", ev) });
您可以使用Rx.Observable.fromEventPattern 。
Rx.Observable.fromEventPattern(
function add(handler) {
$('body').on('click', '.aClass div .something', handler);
},
function remove(handler) {
$('body').off('click', '.aClass div .something', handler);
}
);
这样,它将自动取消可观察订阅中取消订阅的事件处理程序。
<div class='radios'>
<input type='radio' name='r' value='PM'>PM
<input type='radio' name='r' value='PCE'>PCE
<input type='radio' name='r' value='PCS'>PCS
</div>
<textarea class='textarea'>
</textarea>
Rx.Observable.fromEvent(document.querySelector('.radios'),'click')
.subscribe((e)=>console.log(e.target.value));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.