event-propagation | 易学教程

jQuery cycle with pager inside div with click events - can't stop propagation

阅读更多关于 jQuery cycle with pager inside div with click events - can't stop propagation

问题 I'm using the jQuery Isotope plugin. In each clickable (maximising/minimising) Isotope element, I'm having one jQuery Cycle slideshow generated like $('.slideshow.mainview').each(function () { var $pager = $('<div class="pager"></div>').insertAfter(this); // creates a pager for each slideshow $(this).cycle({ speed: 300, timeout: 0, pager: $pager, pagerEvent: 'click', allowPagerClickBubble: false }); }); Clicking on a pager link closes the Isotope element, so one can't see the next slide :(

.preventDefault() not working in on.('input', function{})

阅读更多关于 .preventDefault() not working in on.('input', function{})

问题 I would like to limit number of chars in my editable div to 10. After user reach the limit I would like to use .preventDefault() method to protect the div from additional chars. Can You help me out, please? JSFiddle https://jsfiddle.net/7x2dfgx6/1/ HTML <div class="profileInfo" id="About" style="border:solid;" contenteditable="true">OOOOO</div> JQuery jQuery(document).ready(function($){ const limit = 10; rem = limit - $('#About').text().length; $("#counter").append("You have <strong>" + rem +

Detecting Mouse Events on Multiple Overlapping SVG Elements

阅读更多关于 Detecting Mouse Events on Multiple Overlapping SVG Elements

问题 I'm trying to detect mousemove events on partially overlapping SVG elements, as in this image fiddle <svg> <rect id="red" x=10 y=10 width=60 height=60 style="fill:#ff0000" /> <rect id="orange" x=80 y=10 width=60 height=60 style="fill:#ffcc00" /> <rect id="blue" x=50 y=30 width=60 height=60 style="fill:#0000ff; fill-opacity: 0.8" /> </svg> $('rect').on('mousemove', function() { log(this.id); }); Now, when hovering the mouse over the blue/red intersection I'd like to detect mouse events on both

Event Bubbling, and Stop Propagation

阅读更多关于 Event Bubbling, and Stop Propagation

问题 What is the difference between event.bubbles to false for any event, and setting event.stopPropagation() or stopImmediatePropagation() while handling event? I'm using Flex4 with AS3. 回答1: Setting bubbles to false means the event does not bubble up the display list at all. stopPropagation() and stopImmediatePropagation() make the current event listener the last to process an event. The difference between stopPropagation() and stopImmediatePropagation() is that stopImmediatePropagation() will

React prevent event bubbling in nested components on click

阅读更多关于 React prevent event bubbling in nested components on click

问题 Here's a basic component. Both the <ul> and <li> have onClick functions. I want only the onClick on the <li> to fire, not the <ul> . How can I achieve this? I've played around with e.preventDefault(), e.stopPropagation(), to no avail. class List extends React.Component { constructor(props) { super(props); } handleClick() { // do something } render() { return ( <ul onClick={(e) => { console.log('parent'); this.handleClick(); }} > <li onClick={(e) => { console.log('child'); // prevent default?

QML - Can't get mouse released event when I don't accept mouse pressed event

阅读更多关于 QML - Can't get mouse released event when I don't accept mouse pressed event

问题 I would like to dispatch my onPressed event to subsequent objects in my QML tree, (I have indicate mouse.accepted = false and propagateComposedEvents: true ) but I want to keep the onreleased event working on the top level element .. Here the code : Item { width: 200 height: 200 Rectangle { z: 1 anchors.fill: parent MouseArea{ anchors.fill: parent propagateComposedEvents: true onPressed: { console.log("R1 pressed") mouse.accepted = false } onReleased: { console.log("R1 released") mouse

AngularJS: How to stop event propagation from ng-click?

阅读更多关于 AngularJS: How to stop event propagation from ng-click?

问题 I have directive that does something like so: app.directive('custom', function(){ return { restrict:'A', link: function(scope, element){ element.bind('click', function(){ alert('want to prevent this'); }); } } }); yes, it's necessary to do jQuery-way binding for this case. And now I want to stop this event(click) propagation if some condition met. Tried to do: $event.stopPropagation(); $event.preventDefault(); but it did not help. here fiddle for example - http://jsfiddle.net/STEVER/5bfkbh7u/

angularjs Treeview using ng-include fires ng-click for all node's parents

阅读更多关于 angularjs Treeview using ng-include fires ng-click for all node's parents

问题 I want to write treeview using angularjs . I am using ng-include for recursive call..everything is fine except from ng-click ..when each node is clicked..the hierarchy call is from child to it's parents and for every node in this hierarchy the ng-click fires. how can i solve this problem??..I have this exact problem using another approach (appending element on post-link which I think is not a good way) instead of ng-include . here is my code: index.html: <!doctype html> <html> <head> <script

how to stop event propagation with slide toggle-modified with the updated code.

阅读更多关于 how to stop event propagation with slide toggle-modified with the updated code.

问题 I have a jquery functionality where I have two tabs. On click , each tab makes an ajax call and paints a jsp page. Second tab has got a slide toggle. My problem is initially when the page loads I click on the second tab, the slide toggle works fine. When I click on the first tab and click on the second tab the slide toggle will quickly open and close. How to stop this propagation? I tried event .preventDefault() , stopPropagation() , die etc.. no luck. The code I tried is in below. The slide

JavaScript: Is there any performance benefit to stopping event propagation?

阅读更多关于 JavaScript: Is there any performance benefit to stopping event propagation?

问题 Is it considered 'good practice' to stop JavaScript event propagation - does it benefit performance in any way? I'm wondering if there is benefit outside of layout purposes where you stop propagation so you don't trigger multiple events accidentially. 回答1: Only when it is necessary to the program logic, such as to prevent form submission or another DOM element's action being triggered. Unless you have a seriously complex DOM tree, there will not be any serious performance hit. 回答2: It