Skip to content

Commit 1a4d0b5

Browse files
committed
Handling Events: Remove hard breaks in prose
1 parent 107ffef commit 1a4d0b5

File tree

1 file changed

+10
-32
lines changed

1 file changed

+10
-32
lines changed

page/events/handling-events.md

Lines changed: 10 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,7 @@ attribution:
66
- jQuery Fundamentals
77
---
88

9-
jQuery provides a method `.on()` to
10-
respond to any event on the selected elements. This is called an _event binding_.
11-
Although `.on()` isn't the only method provided for event binding, it is a best
12-
practice to use this for jQuery 1.7+. To learn more, [read more about
13-
the evolution of event binding in jQuery](/events/history-of-events).
9+
jQuery provides a method `.on()` to respond to any event on the selected elements. This is called an _event binding_. Although `.on()` isn't the only method provided for event binding, it is a best practice to use this for jQuery 1.7+. To learn more, [read more about the evolution of event binding in jQuery](/events/history-of-events).
1410

1511
The `.on()` method provides several useful features:
1612

@@ -34,9 +30,7 @@ $( "p" ).on( "click", function() {
3430

3531
#### Many events, but only one event handler
3632

37-
Suppose you want to trigger the same event whenever the mouse hovers over or leaves
38-
the selected elements. The best practice for this is to use "mouseenter mouseleave".
39-
Note the difference between this and the next example.
33+
Suppose you want to trigger the same event whenever the mouse hovers over or leaves the selected elements. The best practice for this is to use "mouseenter mouseleave". Note the difference between this and the next example.
4034

4135
```
4236
// When a user focuses on or changes any input element,
@@ -48,9 +42,7 @@ $( "div" ).on( "mouseenter mouseleave", function() {
4842

4943
#### Many events and handlers
5044

51-
Suppose that instead you want different event handlers for when the mouse enters and
52-
leaves an element. This is more common than the previous example. For example, if you
53-
want to show and hide a tooltip on hover, you would use this.
45+
Suppose that instead you want different event handlers for when the mouse enters and leaves an element. This is more common than the previous example. For example, if you want to show and hide a tooltip on hover, you would use this.
5446

5547
`.on()` accepts an object containing multiple events and handlers.
5648

@@ -70,10 +62,7 @@ $( "div" ).on({
7062

7163
#### The event object
7264

73-
Handling events can be tricky. It's often helpful to use the extra information contained
74-
in the event object passed to the event handler for more control. To become familiar with
75-
the event object, use this code to inspect it in your browser console after you click on
76-
a `<div>` in the page. For a breakdown of the event object, see [Inside the Event Handling Function](/events/inside-event-handling-function/).
65+
Handling events can be tricky. It's often helpful to use the extra information contained in the event object passed to the event handler for more control. To become familiar with the event object, use this code to inspect it in your browser console after you click on a `<div>` in the page. For a breakdown of the event object, see [Inside the Event Handling Function](/events/inside-event-handling-function/).
7766

7867
```
7968
$( "div" ).on( "click", function( event ) {
@@ -97,8 +86,7 @@ $( "p" ).on( "click", {
9786

9887
#### Binding events to elements that don't exist yet
9988

100-
This is called _event delegation_. Here's an example just for completeness, but see the
101-
page on [Event Delegation](/events/event-delegation/) for a full explanation.
89+
This is called _event delegation_. Here's an example just for completeness, but see the page on [Event Delegation](/events/event-delegation/) for a full explanation.
10290

10391
```
10492
$( "ul" ).on( "click", "li", function() {
@@ -108,9 +96,7 @@ $( "ul" ).on( "click", "li", function() {
10896

10997
### Connecting Events to Run Only Once
11098

111-
Sometimes you need a particular handler to run only once — after that, you may
112-
want no handler to run, or you may want a different handler to run. jQuery
113-
provides the `.one()` method for this purpose.
99+
Sometimes you need a particular handler to run only once — after that, you may want no handler to run, or you may want a different handler to run. jQuery provides the `.one()` method for this purpose.
114100

115101
```
116102
// Switching handlers using the `.one()` method
@@ -122,19 +108,13 @@ $( "p" ).one( "click", function() {
122108
});
123109
```
124110

125-
The `.one()` method is especially useful if you need to do some complicated
126-
setup the first time an element is clicked, but not subsequent times.
111+
The `.one()` method is especially useful if you need to do some complicated setup the first time an element is clicked, but not subsequent times.
127112

128-
`.one()` accepts the same arguments as `.on()` which means it supports multiple events to one
129-
or multiple handlers, passing custom data and event delegation.
113+
`.one()` accepts the same arguments as `.on()` which means it supports multiple events to one or multiple handlers, passing custom data and event delegation.
130114

131115
### Disconnecting Events
132116

133-
Although all the fun of jQuery occurs in the `.on()` method, it's counterpart is just as important
134-
if you want to be a responsible developer. `.off()` cleans up that event
135-
binding when you don't need it anymore. Complex user interfaces with lots of event bindings
136-
can bog down browser performance, so using the `.off()` method diligently is a best practice to
137-
ensure that you only have the event bindings that you need, when you need them.
117+
Although all the fun of jQuery occurs in the `.on()` method, it's counterpart is just as important if you want to be a responsible developer. `.off()` cleans up that event binding when you don't need it anymore. Complex user interfaces with lots of event bindings can bog down browser performance, so using the `.off()` method diligently is a best practice to ensure that you only have the event bindings that you need, when you need them.
138118

139119
```
140120
// Unbinding all click handlers on a selection
@@ -159,8 +139,6 @@ $( "p" ).off( "click", bar );
159139

160140
### Namespacing Events
161141

162-
For complex applications and for plugins you share with others, it can be
163-
useful to namespace your events so you don't unintentionally disconnect events
164-
that you didn't or couldn't know about. For details, see Event Namespacing.
142+
For complex applications and for plugins you share with others, it can be useful to namespace your events so you don't unintentionally disconnect events that you didn't or couldn't know about. For details, see Event Namespacing.
165143

166144
<!-- TODO: Link to namespacing -->

0 commit comments

Comments
 (0)