I. jquery events
1, loading events
// equivalent to $ (function () {:}) $ (window). Load (function () {...}) // equivalent to Window.onload = FN
2, basic event binding
Bind (TYPE,[.DATA],FN)//multiple events can be bound: Bind ("MouseOver mouseout", fn)Unbind (TYPE,FN) //Unbind One (TYPE,[.DATA],FN)//bound events are executed only once
//Shorthand binding
Click (FN)/dblclick (FN) mouseover ( fn)/mouseout (FN)MouseEnter (FN)/mouseleave (FN)//Excludes child elements inside the element being moved out
Scroll (FN)
Common form Events
Focus (FN)/blur (FN)
KeyUp (FN)/keydown (FN) //press and Panasonic keys
KeyPress (FN) //When a key value is pressed
Change (FN) //trigger when the value of the form text field (input:text,textarea,select) changes
//Synthetic event hover (fn1,fn2)//equivalent to bind ("MouseEnter") and bind ("MouseLeave")Toggle (Fn1,fn2,fn3 ...)//Successive click events, call multiple functions in turnstrigger (type)//triggers the event for type, which executes the browser default action, type can be a custom nameTriggerhandler (Type)//binds a type event and blocks browser default actions
3, the namespace of the event
Bind ("click.name", FN); Bind ("mouseover.name" , FN), bind ("click", FN); Unbind (". Name" ); // namespace to unbind trigger ("click! "); // matches a Click that does not contain a namespace, that is, the third
4,event Event Object
Bind (Type,function (Event){....})//Add Event object parameters, recommended to be named event or E, can be arbitrarily named in principle//event PropertyEvent. TypeEvent. TargetEvent. relatedtarget//related elements that trigger eventsEvent. pagex/Event. pagey//Relative to the X and Y coordinates of the page
Event. which//Keyboard Event: Returns the Ascall code of the key, click event: 1 (left) 2 (medium) 3 (right). Compatible and mouse events with KeyCode and charcode integrated in JQ
Event . KeyCode //Return the Ascall code of the key, it is recommended to use which//Event method, two simultaneous use, equivalent to adding "return false;"Event. Stoppropagation ();//Stop bubblingEvent. Preventdefault ();//prevent browser events from default behavior
Note:in jquery, when you get and set similar disabled and checked properties, use the Prop () method instead of attr (), only the True/false value.
Second, jquery animation
/**params: The effect of the final style or value of the animation, such as {left: "+=500px"},left will accumulate *speed: animation time, Unit Ms. slow for 600,normal for 400,fast *callback: callback function executed after animation is completed*/Animate (params, Speed,callback); $div. Animate (). Animate () ...//performing animations sequentially. Stop ([clearqueue],[goend])//Two Boolean parameter optional, no parameter stops the current animation only. Delay ()//deferred execution//Animation ShorthandHide ()/show ()//equivalent to CSS ("display": "None/block/inline")Slideup ()/slidedown ()//stretch hidden by height up and downFadeIn ()/fadeout ()//fade in and outFadeTo (Speed,0~1)//progressively adjust to specified transparency//Combo AnimationsToggle () Slidetoggle () Fadetoggle ()
Animate (params,500), commonly used params
{scrolltop: "-=50"}
{height: "+=50"}
"Learning Notes" sharp jquery (iii) events and animations