This is the 26th day of my participation in the August More Text Challenge

preface

Js events are designed to achieve user interaction. For example, when the user clicks the mouse or enters the keyboard, the browser will intercept and inform JS to give feedback and execute corresponding functions to achieve interaction

There are many types of JS events, so today to summarize the commonly used JS events

Common event

Mouse events

Click event, MouseDown event, Mousemove mouse movement event, mouseup event

Contextmenu, MouseEnter/Mouseover mouse entry, mouserLeave/MouseOut mouse exit

DOM3 specifies that the click event can only listen on the left button; Mouse keys can only be determined by mousedown and mouseup

Keyboard events

Keydown When a key is pressed, keyUp when released, or keyPress when pressed and released

Trigger sequence: KeyDown, keyPress, and keyUP

The difference between KeyDown and KeyPress

  • Keydown can respond to any key, and keyPress can only respond to character keys
  • Keypress returns the ASCII code, which can be converted to the corresponding character

The text class operates on events

  • Input: Triggered when text changes
  • Change: judge whether the state changes when the focus is focused or lost. The change event is triggered when the state changes
  • Focus: Triggered when focusing
  • Blur: Triggered when you lose focus

Focus and blur can simulate placeholder

<input type="text" name="user" value="Please enter user name" style="color:#999" 
onfocus="If (this.value==' please enter user name '){this.value ="; this.style.color='#424242'}" 
onblur="If (this.value =="){this.value = 'Please enter user name '; this.style.color='#999'}" >
Copy the code

other

  1. Scroll: To scroll the scroll bar
  2. Load: Triggered when the page is loaded
  3. Abort: Image loading fails
  4. Dblclick: Double-click event
  5. Error: An error occurred while loading images and documents
  6. Resize: The window or frame is resized
  7. Select: when text is selected
  8. Reset: Click the reset button
  9. Submit: When the submit button is clicked

Write in the last

Just learning front end, there are a lot of not very understand

Novice xiao Bai road, welcome to support, comment, thank you big guy ~