diff --git a/types/jquery/JQuery.d.ts b/types/jquery/JQuery.d.ts index 70cfaa0e03..f9a06328e7 100644 --- a/types/jquery/JQuery.d.ts +++ b/types/jquery/JQuery.d.ts @@ -530,7 +530,10 @@ $( document ).ajaxComplete(function( event, request, settings ) { }); ``` */ - ajaxComplete(handler: (this: Document, event: JQuery.Event, jqXHR: JQuery.jqXHR, ajaxOptions: JQuery.AjaxSettings) => void | false): this; + ajaxComplete(handler: (this: Document, + event: JQuery.TriggeredEvent, + jqXHR: JQuery.jqXHR, + ajaxOptions: JQuery.AjaxSettings) => void | false): this; /** * Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event. * @param handler The function to be invoked. @@ -543,7 +546,11 @@ $( document ).ajaxError(function( event, request, settings ) { }); ``` */ - ajaxError(handler: (this: Document, event: JQuery.Event, jqXHR: JQuery.jqXHR, ajaxSettings: JQuery.AjaxSettings, thrownError: string) => void | false): this; + ajaxError(handler: (this: Document, + event: JQuery.TriggeredEvent, + jqXHR: JQuery.jqXHR, + ajaxSettings: JQuery.AjaxSettings, + thrownError: string) => void | false): this; /** * Attach a function to be executed before an Ajax request is sent. This is an Ajax Event. * @param handler The function to be invoked. @@ -556,7 +563,10 @@ $( document ).ajaxSend(function( event, request, settings ) { }); ``` */ - ajaxSend(handler: (this: Document, event: JQuery.Event, jqXHR: JQuery.jqXHR, ajaxOptions: JQuery.AjaxSettings) => void | false): this; + ajaxSend(handler: (this: Document, + event: JQuery.TriggeredEvent, + jqXHR: JQuery.jqXHR, + ajaxOptions: JQuery.AjaxSettings) => void | false): this; /** * Register a handler to be called when the first Ajax request begins. This is an Ajax Event. * @param handler The function to be invoked. @@ -595,7 +605,11 @@ $( document ).ajaxSuccess(function( event, request, settings ) { }); ``` */ - ajaxSuccess(handler: (this: Document, event: JQuery.Event, jqXHR: JQuery.jqXHR, ajaxOptions: JQuery.AjaxSettings, data: JQuery.PlainObject) => void | false): this; + ajaxSuccess(handler: (this: Document, + event: JQuery.TriggeredEvent, + jqXHR: JQuery.jqXHR, + ajaxOptions: JQuery.AjaxSettings, + data: JQuery.PlainObject) => void | false): this; /** * Perform a custom animation of a set of CSS properties. * @param properties An object of CSS properties and values that the animation will move toward. @@ -1329,9 +1343,12 @@ $( "p" ).before( $( "b" ) ); * * **Solution**: Change the method call to use `.on()` or `.off()`, the documentation for the old methods include specific instructions. In general, the `.bind()` and `.unbind()` methods can be renamed directly to `.on()` and `.off()` respectively since the argument orders are identical. */ - bind(eventType: string, - eventData: TData, - handler: JQuery.EventHandler): this; + bind( + eventType: TType, + eventData: TData, + handler: JQuery.TypeEventHandler + ): this; /** * Attach a handler to an event for the elements. * @param eventType A string containing one or more DOM event types, such as "click" or "submit," or custom event names. @@ -1458,8 +1475,13 @@ $( "button" ).click(function() { ``` */ - bind(eventType: string, - handler_preventBubble: JQuery.EventHandler | false | null | undefined): this; + bind( + eventType: TType, + handler_preventBubble: JQuery.TypeEventHandler | + false | + null | + undefined + ): this; /** * Attach a handler to an event for the elements. * @param events An object containing one or more DOM event types and functions to execute for them. @@ -1485,7 +1507,7 @@ $( "div.test" ).bind({ }); ``` */ - bind(events: JQuery.PlainObject | false>): this; + bind(events: JQuery.TypeEventHandlers): this; /** * Bind an event handler to the "blur" JavaScript event, or trigger that event on an element. * @param eventData An object containing data that will be passed to the event handler. @@ -2713,10 +2735,13 @@ $( "button" ).click(function() { * * **Solution**: Change the method call to use `.on()` or `.off()`, the documentation for the old methods include specific instructions. In general, the `.bind()` and `.unbind()` methods can be renamed directly to `.on()` and `.off()` respectively since the argument orders are identical. */ - delegate(selector: JQuery.Selector, - eventType: string, - eventData: TData, - handler: JQuery.EventHandler): this; + delegate( + selector: JQuery.Selector, + eventType: TType, + eventData: TData, + handler: JQuery.TypeEventHandler + ): this; /** * Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements. * @param selector A selector to filter the elements that trigger the event. @@ -2828,9 +2853,12 @@ $( "button" ).click(function() { ``` */ - delegate(selector: JQuery.Selector, - eventType: string, - handler: JQuery.EventHandler | false): this; + delegate( + selector: JQuery.Selector, + eventType: TType, + handler: JQuery.TypeEventHandler | + false + ): this; /** * Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements. * @param selector A selector to filter the elements that trigger the event. @@ -2844,7 +2872,8 @@ $( "button" ).click(function() { * **Solution**: Change the method call to use `.on()` or `.off()`, the documentation for the old methods include specific instructions. In general, the `.bind()` and `.unbind()` methods can be renamed directly to `.on()` and `.off()` respectively since the argument orders are identical. */ delegate(selector: JQuery.Selector, - events: JQuery.PlainObject | false>): this; + events: JQuery.TypeEventHandlers + ): this; /** * Execute the next function on the queue for the matched elements. * @param queueName A string containing the name of the queue. Defaults to fx, the standard effects queue. @@ -7245,7 +7274,10 @@ $( "body" ).on( "click", "p", foo ); $( "body" ).off( "click", "p", foo ); ``` */ - off(events: string, selector: JQuery.Selector, handler: JQuery.EventHandlerBase> | false): this; + off(events: string, + selector: JQuery.Selector, + handler: JQuery.TypeEventHandler | + false): this; /** * Remove an event handler. * @param events One or more space-separated event types and optional namespaces, or just namespaces, such as @@ -7275,7 +7307,10 @@ $( "form" ).on( "keypress.validator", "input[type='text']", validate ); $( "form" ).off( ".validator" ); ``` */ - off(events: string, selector_handler?: JQuery.Selector | JQuery.EventHandlerBase> | false): this; + off(events: string, + selector_handler?: JQuery.Selector | + JQuery.TypeEventHandler | + false): this; /** * Remove an event handler. * @param events An object where the string keys represent one or more space-separated event types and optional @@ -7284,7 +7319,8 @@ $( "form" ).off( ".validator" ); * @see \`{@link https://api.jquery.com/off/ }\` * @since 1.7 */ - off(events: JQuery.PlainObject> | false>, selector?: JQuery.Selector): this; + off(events: JQuery.TypeEventHandlers, + selector?: JQuery.Selector): this; /** * Remove an event handler. * @param event A jQuery.Event object. @@ -7295,7 +7331,7 @@ $( "form" ).off( ".validator" ); $( "p" ).off(); ``` */ - off(event?: JQuery.Event): this; + off(event?: JQuery.TriggeredEvent): this; /** * Set the current coordinates of every element in the set of matched elements, relative to the document. * @param coordinates_function _@param_ `coordinates_function` @@ -7468,10 +7504,30 @@ $( "*", document.body ).click(function( event ) { * @see \`{@link https://api.jquery.com/on/ }\` * @since 1.7 */ - on(events: string, - selector: JQuery.Selector | null, - data: TData, - handler: JQuery.EventHandler): this; + on( + events: TType, + selector: JQuery.Selector, + data: TData, + handler: JQuery.TypeEventHandler + ): this; + /** + * Attach an event handler function for one or more events to the selected elements. + * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". + * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the + * selector is null or omitted, the event is always triggered when it reaches the selected element. + * @param data Data to be passed to the handler in event.data when an event is triggered. + * @param handler A function to execute when the event is triggered. + * @see \`{@link https://api.jquery.com/on/ }\` + * @since 1.7 + */ + on( + events: TType, + selector: null | undefined, + data: TData, + handler: JQuery.TypeEventHandler + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -7484,7 +7540,7 @@ $( "*", document.body ).click(function( event ) { * @deprecated ​ Deprecated. Use \`{@link JQuery.Event }\` in place of \`{@link JQueryEventObject }\`. */ on(events: string, - selector: JQuery.Selector | null, + selector: JQuery.Selector | null | undefined, data: any, handler: ((event: JQueryEventObject) => void)): this; /** @@ -7547,14 +7603,41 @@ $( "body" ).on( "click", "a", function( event ) { }); ``` */ - on(events: string, - selector: JQuery.Selector, - handler: JQuery.EventHandler | false): this; + on( + events: TType, + selector: JQuery.Selector, + handler: JQuery.TypeEventHandler | + false + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". - * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the - * selector is null or omitted, the event is always triggered when it reaches the selected element. + * @param data Data to be passed to the handler in event.data when an event is triggered. + * @param handler A function to execute when the event is triggered. + * @see \`{@link https://api.jquery.com/on/ }\` + * @since 1.7 + * @example ​ ````Pass data to the event handler, which is specified here by name: +```javascript +function myHandler( event ) { + alert( event.data.foo ); +} +$( "p" ).on( "click", { foo: "bar" }, myHandler ); +``` + */ + on( + events: TType, + data: TData, + handler: JQuery.TypeEventHandler + ): this; + /** + * Attach an event handler function for one or more events to the selected elements. + * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". + * @param selector_data _@param_ `selector_data` + *
+ * * `selector` — A selector string to filter the descendants of the selected elements that trigger the event. If the + * selector is null or omitted, the event is always triggered when it reaches the selected element.
+ * * `data` — Data to be passed to the handler in event.data when an event is triggered. * @param handler A function to execute when the event is triggered. * @see \`{@link https://api.jquery.com/on/ }\` * @since 1.7 @@ -7609,37 +7692,6 @@ $( "body" ).on( "click", "a", function( event ) { event.preventDefault(); }); ``` - */ - on(events: string, - selector: JQuery.Selector, - // tslint:disable-next-line:unified-signatures - handler: ((event: JQueryEventObject) => void)): this; - /** - * Attach an event handler function for one or more events to the selected elements. - * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". - * @param data Data to be passed to the handler in event.data when an event is triggered. - * @param handler A function to execute when the event is triggered. - * @see \`{@link https://api.jquery.com/on/ }\` - * @since 1.7 - * @example ​ ````Pass data to the event handler, which is specified here by name: -```javascript -function myHandler( event ) { - alert( event.data.foo ); -} -$( "p" ).on( "click", { foo: "bar" }, myHandler ); -``` - */ - on(events: string, - data: TData, - handler: JQuery.EventHandler): this; - /** - * Attach an event handler function for one or more events to the selected elements. - * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". - * @param data Data to be passed to the handler in event.data when an event is triggered. - * @param handler A function to execute when the event is triggered. - * @see \`{@link https://api.jquery.com/on/ }\` - * @since 1.7 - * @deprecated ​ Deprecated. Use \`{@link JQuery.Event }\` in place of \`{@link JQueryEventObject }\`. * @example ​ ````Pass data to the event handler, which is specified here by name: ```javascript function myHandler( event ) { @@ -7649,8 +7701,7 @@ $( "p" ).on( "click", { foo: "bar" }, myHandler ); ``` */ on(events: string, - // tslint:disable-next-line:unified-signatures - data: any, + selector_data: any, handler: ((event: JQueryEventObject) => void)): this; /** * Attach an event handler function for one or more events to the selected elements. @@ -7743,8 +7794,11 @@ $( "#cart" ).on( "mouseenter mouseleave", function( event ) { }); ``` */ - on(events: string, - handler: JQuery.EventHandler | false): this; + on( + events: TType, + handler: JQuery.TypeEventHandler | + false + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -7837,7 +7891,6 @@ $( "#cart" ).on( "mouseenter mouseleave", function( event ) { ``` */ on(events: string, - // tslint:disable-next-line:unified-signatures handler: ((event: JQueryEventObject) => void)): this; /** * Attach an event handler function for one or more events to the selected elements. @@ -7849,9 +7902,26 @@ $( "#cart" ).on( "mouseenter mouseleave", function( event ) { * @see \`{@link https://api.jquery.com/on/ }\` * @since 1.7 */ - on(events: JQuery.PlainObject | false>, - selector: JQuery.Selector | null, - data: TData): this; + on( + events: JQuery.TypeEventHandlers, + selector: JQuery.Selector, + data: TData + ): this; + /** + * Attach an event handler function for one or more events to the selected elements. + * @param events An object in which the string keys represent one or more space-separated event types and optional + * namespaces, and the values represent a handler function to be called for the event(s). + * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If + * the selector is null or omitted, the handler is always called when it reaches the selected element. + * @param data Data to be passed to the handler in event.data when an event occurs. + * @see \`{@link https://api.jquery.com/on/ }\` + * @since 1.7 + */ + on( + events: JQuery.TypeEventHandlers, + selector: null | undefined, + data: TData + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -7861,9 +7931,9 @@ $( "#cart" ).on( "mouseenter mouseleave", function( event ) { * @see \`{@link https://api.jquery.com/on/ }\` * @since 1.7 */ - on(events: JQuery.PlainObject | false>, - // tslint:disable-next-line:unified-signatures - selector: JQuery.Selector): this; + on(events: JQuery.TypeEventHandlers, + selector: JQuery.Selector + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -7872,8 +7942,10 @@ $( "#cart" ).on( "mouseenter mouseleave", function( event ) { * @see \`{@link https://api.jquery.com/on/ }\` * @since 1.7 */ - on(events: JQuery.PlainObject | false>, - data: TData): this; + on( + events: JQuery.TypeEventHandlers, + data: TData + ): this; /** * Attach an event handler function for one or more events to the selected elements. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -7922,7 +7994,7 @@ $( "div.test" ).on({ ``` */ - on(events: JQuery.PlainObject | false>): this; + on(events: JQuery.TypeEventHandlers): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -7933,10 +8005,30 @@ $( "div.test" ).on({ * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: string, - selector: JQuery.Selector | null, - data: TData, - handler: JQuery.EventHandler): this; + one( + events: TType, + selector: JQuery.Selector, + data: TData, + handler: JQuery.TypeEventHandler + ): this; + /** + * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. + * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". + * @param selector A selector string to filter the descendants of the selected elements that trigger the event. If the + * selector is null or omitted, the event is always triggered when it reaches the selected element. + * @param data Data to be passed to the handler in event.data when an event is triggered. + * @param handler A function to execute when the event is triggered. + * @see \`{@link https://api.jquery.com/one/ }\` + * @since 1.7 + */ + one( + events: TType, + selector: null | undefined, + data: TData, + handler: JQuery.TypeEventHandler + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -7947,9 +8039,12 @@ $( "div.test" ).on({ * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: string, + one( + events: TType, selector: JQuery.Selector, - handler: JQuery.EventHandler | false): this; + handler: JQuery.TypeEventHandler | + false + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -7958,9 +8053,12 @@ $( "div.test" ).on({ * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: string, - data: TData, - handler: JQuery.EventHandler): this; + one( + events: TType, + data: TData, + handler: JQuery.TypeEventHandler + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin". @@ -8049,8 +8147,11 @@ $(".target").one("click mouseenter", function() { ``` */ - one(events: string, - handler: JQuery.EventHandler | false): this; + one( + events: TType, + handler: JQuery.TypeEventHandler| + false + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -8061,9 +8162,26 @@ $(".target").one("click mouseenter", function() { * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: JQuery.PlainObject | false>, - selector: JQuery.Selector | null, - data: TData): this; + one( + events: JQuery.TypeEventHandlers, + selector: JQuery.Selector, + data: TData + ): this; + /** + * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. + * @param events An object in which the string keys represent one or more space-separated event types and optional + * namespaces, and the values represent a handler function to be called for the event(s). + * @param selector A selector string to filter the descendants of the selected elements that will call the handler. If + * the selector is null or omitted, the handler is always called when it reaches the selected element. + * @param data Data to be passed to the handler in event.data when an event occurs. + * @see \`{@link https://api.jquery.com/one/ }\` + * @since 1.7 + */ + one( + events: JQuery.TypeEventHandlers, + selector: null | undefined, + data: TData + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -8073,8 +8191,7 @@ $(".target").one("click mouseenter", function() { * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: JQuery.PlainObject | false>, - // tslint:disable-next-line:unified-signatures + one(events: JQuery.TypeEventHandlers, selector: JQuery.Selector): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. @@ -8084,8 +8201,10 @@ $(".target").one("click mouseenter", function() { * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: JQuery.PlainObject | false>, - data: TData): this; + one( + events: JQuery.TypeEventHandlers, + data: TData + ): this; /** * Attach a handler to an event for the elements. The handler is executed at most once per element per event type. * @param events An object in which the string keys represent one or more space-separated event types and optional @@ -8093,7 +8212,7 @@ $(".target").one("click mouseenter", function() { * @see \`{@link https://api.jquery.com/one/ }\` * @since 1.7 */ - one(events: JQuery.PlainObject | false>): this; + one(events: JQuery.TypeEventHandlers): this; /** * Set the CSS outer height of each element in the set of matched elements. * @param value_function _@param_ `value_function` @@ -11704,7 +11823,7 @@ $( "body" ).trigger({ }); ``` */ - trigger(eventType_event: string | JQuery.Event, extraParameters?: any[] | JQuery.PlainObject | string | number | boolean): this; + trigger(eventType_event: string | JQuery.Event, extraParameters?: any[] | JQuery.PlainObject | string | number | boolean): this; /** * Execute all handlers attached to an element for an event. * @param eventType_event _@param_ `eventType_event` @@ -11747,7 +11866,7 @@ $( "input" ).focus(function() { ``` */ - triggerHandler(eventType_event: string | JQuery.Event, extraParameters?: any[] | JQuery.PlainObject | string | number | boolean): any; + triggerHandler(eventType_event: string | JQuery.Event, extraParameters?: any[] | JQuery.PlainObject | string | number | boolean): any; /** * Remove a previously-attached event handler from the elements. * @param event A string containing one or more DOM event types, such as "click" or "submit," or custom event names. @@ -11815,7 +11934,10 @@ $( "p" ).bind( "click", foo ); // ... Now foo will be called when paragraphs are $( "p" ).unbind( "click", foo ); // ... foo will no longer be called. ``` */ - unbind(event: string, handler: JQuery.EventHandlerBase> | false): this; + unbind(event: string, + handler: JQuery.TypeEventHandler | + false + ): this; /** * Remove a previously-attached event handler from the elements. * @param event A string containing one or more DOM event types, such as "click" or "submit," or custom event names. @@ -11836,7 +11958,7 @@ $( "p" ).unbind(); $( "p" ).unbind( "click" ); ``` */ - unbind(event?: string | JQuery.Event): this; + unbind(event?: string | JQuery.TriggeredEvent): this; /** * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements. * @param selector A selector which will be used to filter the event results. @@ -11906,12 +12028,18 @@ $( "body" ).delegate( "p", "click", foo ); $( "body" ).undelegate( "p", "click", foo ); ``` */ - undelegate(selector: JQuery.Selector, eventType: string, handler: JQuery.EventHandlerBase> | false): this; + undelegate(selector: JQuery.Selector, + eventType: string, + handler: JQuery.TypeEventHandler | + false + ): this; /** * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements. * @param selector A selector which will be used to filter the event results. - * @param eventTypes A string containing a JavaScript event type, such as "click" or "keydown" - * An object of one or more event types and previously bound functions to unbind from them. + * @param eventType_events _@param_ `eventType_events` + *
+ * * `eventType` — A string containing a JavaScript event type, such as "click" or "keydown"
+ * * `events` — An object of one or more event types and previously bound functions to unbind from them. * @see \`{@link https://api.jquery.com/undelegate/ }\` * @since 1.4.2 * @since 1.4.3 @@ -11921,7 +12049,9 @@ $( "body" ).undelegate( "p", "click", foo ); * * **Solution**: Change the method call to use `.on()` or `.off()`, the documentation for the old methods include specific instructions. In general, the `.bind()` and `.unbind()` methods can be renamed directly to `.on()` and `.off()` respectively since the argument orders are identical. */ - undelegate(selector: JQuery.Selector, eventTypes: string | JQuery.PlainObject> | false>): this; + undelegate(selector: JQuery.Selector, + eventType_events: string | + JQuery.TypeEventHandlers): this; /** * Remove a handler from the event for all elements which match the current selector, based upon a specific set of root elements. * @param namespace A selector which will be used to filter the event results. diff --git a/types/jquery/jquery-tests.ts b/types/jquery/jquery-tests.ts index 4f848cc7bb..b08b48d0b0 100644 --- a/types/jquery/jquery-tests.ts +++ b/types/jquery/jquery-tests.ts @@ -2430,7 +2430,7 @@ function JQuery() { $(document).ajaxComplete(function(event, jqXHR, ajaxOptions) { // $ExpectType Document this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; // $ExpectType jqXHR jqXHR; @@ -2446,7 +2446,7 @@ function JQuery() { $(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) { // $ExpectType Document this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; // $ExpectType jqXHR jqXHR; @@ -2464,7 +2464,7 @@ function JQuery() { $(document).ajaxSend(function(event, jqXHR, ajaxOptions) { // $ExpectType Document this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; // $ExpectType jqXHR jqXHR; @@ -2500,7 +2500,7 @@ function JQuery() { $(document).ajaxSuccess(function(event, jqXHR, ajaxOptions, data) { // $ExpectType Document this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; // $ExpectType jqXHR jqXHR; @@ -3887,7 +3887,7 @@ function JQuery() { $('p').bind('myEvent', 'myData', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -3895,45 +3895,45 @@ function JQuery() { $('p').bind('myEvent', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); // $ExpectType JQuery $('p').bind('myEvent', false); + // $ExpectType JQuery + $('p').bind('myEvent', null); + + // $ExpectType JQuery + $('p').bind('myEvent', undefined); + // $ExpectType JQuery $('p').bind({ myEvent1: false, myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }); - - // $ExpectType JQuery - $('p').bind('myEvent', null); - - // $ExpectType JQuery - $('p').bind('myEvent', undefined); - } + } function delegate() { // $ExpectType JQuery $('table').delegate('td', 'myEvent', 'myData', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); // $ExpectType JQuery $('table').delegate('td', 'myEvent', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -3942,20 +3942,20 @@ function JQuery() { // $ExpectType JQuery $('table').delegate('td', { - myEvent1(event) { - // $ExpectType HTMLElement + myEvent1: false, + myEvent2(event) { + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; - }, - myEvent2: false + } }); } function off() { - function defaultData(this: HTMLElement, event: JQuery.Event) { } + function defaultData(this: HTMLElement, event: JQuery.TriggeredEvent) { } - function customData(this: HTMLElement, event: JQuery.Event) { } + function customData(this: HTMLElement, event: JQuery.TriggeredEvent) { } // $ExpectType JQuery $('table').off('myEvent', 'td', defaultData); @@ -3995,27 +3995,19 @@ function JQuery() { customData }); + const ev: JQuery.TriggeredEvent = undefined!; // $ExpectType JQuery - $('table').off($.Event('myEvent')); + $('table').off(ev); // $ExpectType JQuery $('table').off(); } function on() { - // $ExpectType JQuery $('table').on('myEvent', 'td', 'myData', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event - event; - }); - - // $ExpectType JQuery - $('table').on('myEvent', 'td', 'myData', function(event: JQueryEventObject) { - // $ExpectType HTMLElement - this; - // $ExpectType JQueryEventObject + // $ExpectType TriggeredEvent event; }); @@ -4023,12 +4015,38 @@ function JQuery() { $('table').on('myEvent', null, 'myData', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent + event; + }); + + // $ExpectType JQuery + $('table').on('myEvent', undefined, 'myData', function(event) { + // $ExpectType HTMLElement + this; + // $ExpectType TriggeredEvent + event; + }); + + // $ExpectType JQuery + $('table').on('myEvent', 'td', 'myData', function(event: JQueryEventObject) { + // $ExpectType any + this; + // $ExpectType JQueryEventObject event; }); // $ExpectType JQuery $('table').on('myEvent', null, 'myData', function(event: JQueryEventObject) { + // TODO: Why is this HTMLElement? The callback signature doesn't even have `this` declared. + // $ExpectType HTMLElement + this; + // $ExpectType JQueryEventObject + event; + }); + + // $ExpectType JQuery + $('table').on('myEvent', undefined, 'myData', function(event: JQueryEventObject) { + // TODO: Why is this HTMLElement? The callback signature doesn't even have `this` declared. // $ExpectType HTMLElement this; // $ExpectType JQueryEventObject @@ -4037,17 +4055,9 @@ function JQuery() { // $ExpectType JQuery $('table').on('myEvent', 'td', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event - event; - }); - - // $ExpectType JQuery - $('table').on('myEvent', 'td', function(event: JQueryEventObject) { - // $ExpectType HTMLElement - this; - // $ExpectType JQueryEventObject + // $ExpectType TriggeredEvent event; }); @@ -4058,7 +4068,15 @@ function JQuery() { $('table').on('myEvent', 3, function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent + event; + }); + + // $ExpectType JQuery + $('table').on('myEvent', 'td', function(event: JQueryEventObject) { + // $ExpectType any + this; + // $ExpectType JQueryEventObject event; }); @@ -4074,10 +4092,13 @@ function JQuery() { $('table').on('myEvent', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); + // $ExpectType JQuery + $('table').on('myEvent', false); + // $ExpectType JQuery $('table').on('myEvent', function(event: JQueryEventObject) { // $ExpectType HTMLElement @@ -4110,16 +4131,13 @@ function JQuery() { event; }); - // $ExpectType JQuery - $('table').on('myEvent', false); - // $ExpectType JQuery $('table').on({ myEvent1: false, myEvent2(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, 'td', 'myData'); @@ -4130,7 +4148,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, null, 'myData'); @@ -4141,7 +4159,18 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent + event; + } + }, undefined, 'myData'); + + // $ExpectType JQuery + $('table').on({ + myEvent1: false, + myEvent2(event) { + // $ExpectType any + this; + // $ExpectType TriggeredEvent event; } }, 'td'); @@ -4152,7 +4181,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, 3); @@ -4163,7 +4192,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }); @@ -4172,9 +4201,9 @@ function JQuery() { function one() { // $ExpectType JQuery $('table').one('myEvent', 'td', 'myData', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -4182,15 +4211,23 @@ function JQuery() { $('table').one('myEvent', null, 'myData', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent + event; + }); + + // $ExpectType JQuery + $('table').one('myEvent', undefined, 'myData', function(event) { + // $ExpectType HTMLElement + this; + // $ExpectType TriggeredEvent event; }); // $ExpectType JQuery $('table').one('myEvent', 'td', function(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -4201,7 +4238,7 @@ function JQuery() { $('table').one('myEvent', 3, function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -4209,7 +4246,7 @@ function JQuery() { $('table').one('myEvent', function(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; }); @@ -4220,9 +4257,9 @@ function JQuery() { $('table').one({ myEvent1: false, myEvent2(event) { - // $ExpectType HTMLElement + // $ExpectType any this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, 'td', 'myData'); @@ -4233,7 +4270,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, null, 'myData'); @@ -4244,7 +4281,18 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent + event; + } + }, undefined, 'myData'); + + // $ExpectType JQuery + $('table').one({ + myEvent1: false, + myEvent2(event) { + // $ExpectType any + this; + // $ExpectType TriggeredEvent event; } }, 'td'); @@ -4255,7 +4303,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }, 3); @@ -4266,7 +4314,7 @@ function JQuery() { myEvent2(event) { // $ExpectType HTMLElement this; - // $ExpectType Event + // $ExpectType TriggeredEvent event; } }); @@ -4337,9 +4385,9 @@ function JQuery() { } function unbind() { - function defaultData(this: HTMLElement, event: JQuery.Event) { } + function defaultData(this: HTMLElement, event: JQuery.TriggeredEvent) { } - function customData(this: HTMLElement, event: JQuery.Event) { } + function customData(this: HTMLElement, event: JQuery.TriggeredEvent) { } // $ExpectType JQuery $('p').unbind('myEvent', defaultData); @@ -4353,17 +4401,18 @@ function JQuery() { // $ExpectType JQuery $('p').unbind('myEvent'); + const ev: JQuery.TriggeredEvent = undefined!; // $ExpectType JQuery - $('p').unbind($.Event('myEvent')); + $('p').unbind(ev); // $ExpectType JQuery $('p').unbind(); } function undelegate() { - function defaultData(this: HTMLElement, event: JQuery.Event) { } + function defaultData(this: HTMLElement, event: JQuery.TriggeredEvent) { } - function customData(this: HTMLElement, event: JQuery.Event) { } + function customData(this: HTMLElement, event: JQuery.TriggeredEvent) { } // $ExpectType JQuery $('table').undelegate('td', 'click', defaultData); @@ -7696,18 +7745,18 @@ function JQuery_Effects() { function JQuery_Event() { function call_signature() { - // $ExpectType Event & Coordinates + // $ExpectType Event & Coordinates $.Event('keydown', $('p').offset()); } function constructor() { - // $ExpectType Event & Coordinates + // $ExpectType Event & Coordinates new $.Event('keydown', $('p').offset()); } // https://stackoverflow.com/questions/49892574/trigger-a-jquery-3-event-with-ctrlkey-set function stackoverflow_49892574() { - const event = $.Event("keydown"); + const event = $.Event("keydown"); event.which = 77; event.ctrlKey = true; $(window).trigger(event); @@ -7727,7 +7776,7 @@ function JQuery_EventExtensions() { data; // $ExpectType string namespaces; - // $ExpectType EventHandler + // $ExpectType EventHandlerBase> eventHandle; return false; @@ -7753,7 +7802,7 @@ function JQuery_EventExtensions() { trigger(event, data) { // $ExpectType EventTarget this; - // $ExpectType Event + // $ExpectType Event event; // $ExpectType any data; @@ -7761,7 +7810,7 @@ function JQuery_EventExtensions() { return false; }, _default(event, data) { - // $ExpectType Event + // $ExpectType TriggeredEvent event; // $ExpectType any data; @@ -7769,7 +7818,7 @@ function JQuery_EventExtensions() { return false; }, handle(event, data) { - // $ExpectType Event & { handleObj: HandleObject; } + // $ExpectType TriggeredEvent & { handleObj: HandleObject; } event; // $ExpectType any data; @@ -7777,7 +7826,7 @@ function JQuery_EventExtensions() { preDispatch(event) { // $ExpectType EventTarget this; - // $ExpectType Event + // $ExpectType Event event; return false; @@ -7785,7 +7834,7 @@ function JQuery_EventExtensions() { postDispatch(event) { // $ExpectType EventTarget this; - // $ExpectType Event + // $ExpectType Event event; } }; diff --git a/types/jquery/misc.d.ts b/types/jquery/misc.d.ts index 94f7279e63..d966f1b787 100644 --- a/types/jquery/misc.d.ts +++ b/types/jquery/misc.d.ts @@ -3981,45 +3981,97 @@ $( "input" ).click(function() { // This should be a class but doesn't work correctly under the JQuery namespace. Event should be an inner class of jQuery. - // Static members + /** + * jQuery's event system normalizes the event object according to W3C standards. The event object is guaranteed to be passed to the event handler (no checks for window.event required). It normalizes the target, relatedTarget, which, metaKey and pageX/Y properties and provides both stopPropagation() and preventDefault() methods. + * + * Those properties are all documented, and accompanied by examples, on the \`{@link http://api.jquery.com/category/events/event-object/ Event object}\` page. + * + * The standard events in the Document Object Model are: `blur`, `focus`, `load`, `resize`, `scroll`, `unload`, `beforeunload`, `click`, `dblclick`, `mousedown`, `mouseup`, `mousemove`, `mouseover`, `mouseout`, `mouseenter`, `mouseleave`, `change`, `select`, `submit`, `keydown`, `keypress`, and `keyup`. Since the DOM event names have predefined meanings for some elements, using them for other purposes is not recommended. jQuery's event model can trigger an event by any name on an element, and it is propagated up the DOM tree to which that element belongs, if any. + * @see \`{@link https://api.jquery.com/category/events/event-object/ }\` + */ interface EventStatic { - // tslint:disable-next-line:no-unnecessary-generics - (event: string, properties?: T): Event & T; - // tslint:disable-next-line:no-unnecessary-generics - new (event: string, properties?: T): Event & T; + /** + * The jQuery.Event constructor is exposed and can be used when calling trigger. The new operator is optional. + * + * Check \`{@link https://api.jquery.com/trigger/ trigger}\`'s documentation to see how to combine it with your own event object. + * @see \`{@link https://api.jquery.com/category/events/event-object/ }\` + * @since 1.6 + * @example +```javascript +//Create a new jQuery.Event object without the "new" operator. +var e = jQuery.Event( "click" ); +​ +// trigger an artificial click event +jQuery( "body" ).trigger( e ); +``` + * @example +```javascript +// Create a new jQuery.Event object with specified event properties. +var e = jQuery.Event( "keydown", { keyCode: 64 } ); +​ +// trigger an artificial keydown event with keyCode 64 +jQuery( "body" ).trigger( e ); +``` + */ + (event: string, properties?: T): Event & T; + /** + * The jQuery.Event constructor is exposed and can be used when calling trigger. The new operator is optional. + * + * Check \`{@link https://api.jquery.com/trigger/ trigger}\`'s documentation to see how to combine it with your own event object. + * @see \`{@link https://api.jquery.com/category/events/event-object/ }\` + * @since 1.6 + * @example +```javascript +//Create a new jQuery.Event object without the "new" operator. +var e = jQuery.Event( "click" ); +​ +// trigger an artificial click event +jQuery( "body" ).trigger( e ); +``` + * @example +```javascript +// Create a new jQuery.Event object with specified event properties. +var e = jQuery.Event( "keydown", { keyCode: 64 } ); +​ +// trigger an artificial keydown event with keyCode 64 +jQuery( "body" ).trigger( e ); +``` + */ + new (event: string, properties?: T): Event & T; } - // Instance members + /** + * jQuery's event system normalizes the event object according to W3C standards. The event object is guaranteed to be passed to the event handler (no checks for window.event required). It normalizes the target, relatedTarget, which, metaKey and pageX/Y properties and provides both stopPropagation() and preventDefault() methods. + * + * Those properties are all documented, and accompanied by examples, on the \`{@link http://api.jquery.com/category/events/event-object/ Event object}\` page. + * + * The standard events in the Document Object Model are: `blur`, `focus`, `load`, `resize`, `scroll`, `unload`, `beforeunload`, `click`, `dblclick`, `mousedown`, `mouseup`, `mousemove`, `mouseover`, `mouseout`, `mouseenter`, `mouseleave`, `change`, `select`, `submit`, `keydown`, `keypress`, and `keyup`. Since the DOM event names have predefined meanings for some elements, using them for other purposes is not recommended. jQuery's event model can trigger an event by any name on an element, and it is propagated up the DOM tree to which that element belongs, if any. + * @see \`{@link https://api.jquery.com/category/events/event-object/ }\` + * @see \`{@link TriggeredEvent }\` + */ interface Event { // region Copied properties // #region Copied properties - // region Event - // #region Event + // Event - bubbles?: boolean; - cancelable?: boolean; - eventPhase?: number; + bubbles: boolean | undefined; + cancelable: boolean | undefined; + eventPhase: number | undefined; - // #endregion + // UIEvent - // region UIEvent - // #region UIEvent + detail: number | undefined; + view: Window | undefined; - detail?: number; - view?: Window; + // MouseEvent - // #endregion - - // region MouseEvent - // #region MouseEvent - - button?: number; - buttons?: number; - clientX?: number; - clientY?: number; - offsetX?: number; - offsetY?: number; + button: number | undefined; + buttons: number | undefined; + clientX: number | undefined; + clientY: number | undefined; + offsetX: number | undefined; + offsetY: number | undefined; /** * The mouse position relative to the left edge of the document. * @see \`{@link https://api.jquery.com/event.pageX/ }\` @@ -4055,7 +4107,7 @@ $( document ).on( "mousemove", function( event ) { ``` */ - pageX: number; + pageX: number | undefined; /** * The mouse position relative to the top edge of the document. * @see \`{@link https://api.jquery.com/event.pageY/ }\` @@ -4091,49 +4143,93 @@ $( document ).on( "mousemove", function( event ) { ``` */ - pageY: number; - screenX?: number; - screenY?: number; + pageY: number | undefined; + screenX: number | undefined; + screenY: number | undefined; /** @deprecated */ - toElement?: Element; + toElement: Element | undefined; - // #endregion + // PointerEvent - // region PointerEvent - // #region PointerEvent + pointerId: number | undefined; + pointerType: string | undefined; - pointerId?: number; - pointerType?: string; - - // #endregion - - // region KeyboardEvent - // #region KeyboardEvent + // KeyboardEvent /** @deprecated */ - char?: string; + char: string | undefined; /** @deprecated */ - charCode?: number; - key?: string; + charCode: number | undefined; + key: string | undefined; /** @deprecated */ - keyCode?: number; + keyCode: number | undefined; - // #endregion + // TouchEvent - // region TouchEvent - // #region TouchEvent + changedTouches: TouchList | undefined; + targetTouches: TouchList | undefined; + touches: TouchList | undefined; - changedTouches?: TouchList; - targetTouches?: TouchList; - touches?: TouchList; + // MouseEvent, KeyboardEvent - // #endregion + /** + * For key or mouse events, this property indicates the specific key or button that was pressed. + * @see \`{@link https://api.jquery.com/event.which/ }\` + * @since 1.1.3 + * @deprecated ​ Deprecated since 3.3. See \`{@link https://github.com/jquery/api.jquery.com/issues/821 }\`. + * @example ​ ````Log which key was depressed. +```html + + + + + event.which demo + + + +​ + +
+​ + +​ + + +``` + * @example ​ ````Log which mouse button was depressed. +```html + + + + + event.which demo + + + +​ + +
+​ + +​ + + +``` + */ + which: number | undefined; - // region MouseEvent, KeyboardEvent, TouchEvent - // #region MouseEvent, KeyboardEvent, TouchEvent + // MouseEvent, KeyboardEvent, TouchEvent - altKey?: boolean; - ctrlKey?: boolean; + altKey: boolean | undefined; + ctrlKey: boolean | undefined; /** * Indicates whether the META key was pressed when the event fired. * @see \`{@link https://api.jquery.com/event.metaKey/ }\` @@ -4170,77 +4266,11 @@ $( "#checkMetaKey" ).click(function( event ) { ``` */ - metaKey: boolean; - shiftKey?: boolean; + metaKey: boolean | undefined; + shiftKey: boolean | undefined; // #endregion - // #endregion - - /** - * The namespace specified when the event was triggered. - * @see \`{@link https://api.jquery.com/event.namespace/ }\` - * @since 1.4.3 - * @example ​ ````Determine the event namespace used. -```html - - - - - event.namespace demo - - - -​ - -

-​ - -​ - - -``` - */ - namespace: string; - /** - * The last value returned by an event handler that was triggered by this event, unless the value was undefined. - * @see \`{@link https://api.jquery.com/event.result/ }\` - * @since 1.3 - * @example ​ ````Display previous handler's return value -```html - - - - - event.result demo - - - -​ - -

-​ - -​ - - -``` - */ - result: any; /** * The difference in milliseconds between the time the browser created the event and January 1, 1970. * @see \`{@link https://api.jquery.com/event.timeStamp/ }\` @@ -4297,59 +4327,6 @@ $( "a" ).click(function( event ) { ``` */ type: string; - /** - * For key or mouse events, this property indicates the specific key or button that was pressed. - * @see \`{@link https://api.jquery.com/event.which/ }\` - * @since 1.1.3 - * @deprecated ​ Deprecated since 3.3. See \`{@link https://github.com/jquery/api.jquery.com/issues/821 }\`. - * @example ​ ````Log which key was depressed. -```html - - - - - event.which demo - - - -​ - -
-​ - -​ - - -``` - * @example ​ ````Log which mouse button was depressed. -```html - - - - - event.which demo - - - -​ - -
-​ - -​ - - -``` - */ - which: number; /** * Returns whether event.preventDefault() was ever called on this event object. * @see \`{@link https://api.jquery.com/event.isDefaultPrevented/ }\` @@ -4542,11 +4519,17 @@ $( "p" ).click(function( event ) { stopPropagation(): void; } - // Generic members - interface Event< - TTarget = EventTarget, - TData = null - > { + // #endregion + + /** + * Base type for jQuery events that have been triggered (including events triggered on plain objects). + */ + interface TriggeredEvent< + TDelegateTarget = any, + TData = any, + TCurrentTarget = any, + TTarget = any + > extends Event { /** * The current DOM element within the event bubbling phase. * @see \`{@link https://api.jquery.com/event.currentTarget/ }\` @@ -4557,51 +4540,8 @@ $( "p" ).click(function( event ) { alert( event.currentTarget === this ); // true }); ``` - */ - currentTarget: TTarget; - /** - * An optional object of data passed to an event method when the current executing handler is bound. - * @see \`{@link https://api.jquery.com/event.data/ }\` - * @since 1.1 - * @example ​ ````Within a for loop, pass the value of i to the .on() method so that the current iteration's value is preserved. -```html - - - - - event.data demo - - - -​ - - - - - -​ -
-​ - -​ - - -``` - */ - data: TData; + */ + currentTarget: TCurrentTarget; /** * The element where the currently-called jQuery event handler was attached. * @see \`{@link https://api.jquery.com/event.delegateTarget/ }\` @@ -4612,21 +4552,8 @@ $( ".box" ).on( "click", "button", function( event ) { $( event.delegateTarget ).css( "background-color", "red" ); }); ``` - */ - delegateTarget: TTarget; - originalEvent: _Event; - /** - * The other DOM element involved in the event, if any. - * @see \`{@link https://api.jquery.com/event.relatedTarget/ }\` - * @since 1.1.4 - * @example ​ ````On mouseout of anchors, alert the element type being entered. -```javascript -$( "a" ).mouseout(function( event ) { - alert( event.relatedTarget.nodeName ); // "DIV" -}); -``` - */ - relatedTarget: TTarget | null; + */ + delegateTarget: TDelegateTarget; /** * The DOM element that initiated the event. * @see \`{@link https://api.jquery.com/event.target/ }\` @@ -4704,17 +4631,173 @@ $( "ul" ).click( handler ).find( "ul" ).hide(); ``` - */ + */ target: TTarget; + + /** + * An optional object of data passed to an event method when the current executing handler is bound. + * @see \`{@link https://api.jquery.com/event.data/ }\` + * @since 1.1 + * @example ​ ````Within a for loop, pass the value of i to the .on() method so that the current iteration's value is preserved. +```html + + + + + event.data demo + + + +​ + + + + + +​ +
+​ + +​ + + +``` + */ + data: TData; + + /** + * The namespace specified when the event was triggered. + * @see \`{@link https://api.jquery.com/event.namespace/ }\` + * @since 1.4.3 + * @example ​ ````Determine the event namespace used. +```html + + + + + event.namespace demo + + + +​ + +

+​ + +​ + + +``` + */ + namespace?: string; + /** + * The last value returned by an event handler that was triggered by this event, unless the value was undefined. + * @see \`{@link https://api.jquery.com/event.result/ }\` + * @since 1.3 + * @example ​ ````Display previous handler's return value +```html + + + + + event.result demo + + + +​ + +

+​ + +​ + + +``` + */ + result?: any; } - // #endregion - - interface EventHandler extends EventHandlerBase> { } + interface TypeToTriggeredEventMap< + TDelegateTarget, + TData, + TCurrentTarget, + TTarget + > { + [type: string]: TriggeredEvent; + } // Extra parameters can be passed from trigger() type EventHandlerBase = (this: TContext, t: T, ...args: any[]) => any; + type EventHandler< + TCurrentTarget, + TData = undefined + > = EventHandlerBase>; + + type TypeEventHandler< + TDelegateTarget, + TData, + TCurrentTarget, + TTarget, + TContext, + TType extends keyof TypeToTriggeredEventMap + > = EventHandlerBase[TType]>; + + interface TypeEventHandlers< + TDelegateTarget, + TData, + TCurrentTarget, + TTarget, + TContext + > extends _TypeEventHandlers { + // No idea why it's necessary to include `object` in the union but otherwise TypeScript complains that + // derived types of Event are not assignable to Event. + [type: string]: TypeEventHandler | + false | + undefined | + object; + } + + type _TypeEventHandlers< + TDelegateTarget, + TData, + TCurrentTarget, + TTarget, + TContext + > = { + [TType in keyof TypeToTriggeredEventMap]?: + TypeEventHandler | + false | + object; + }; + // region Event extensions // #region Event extensions @@ -4791,13 +4874,13 @@ $( "ul" ).click( handler ).find( "ul" ).hide(); * The trigger hook is called early in the process of triggering an event, just after the `jQuery.Event` object is constructed and before any handlers have been called. It can process the triggered event in any way, for example by calling `event.stopPropagation()` or `event.preventDefault()` before returning. If the hook returns `false`, jQuery does not perform any further event triggering actions and returns immediately. Otherwise, it performs the normal trigger processing, calling any event handlers for the element and bubbling the event (unless propagation is stopped in advance or `noBubble` was specified for the special event) to call event handlers attached to parent elements. * @see \`{@link https://learn.jquery.com/events/event-extensions/#trigger-function-event-jquery-event-data-object }\` */ - trigger(this: TTarget, event: Event, data: TData): void | false; + trigger(this: TTarget, event: Event, data: TData): void | false; } | { /** * When the `.trigger()` method finishes running all the event handlers for an event, it also looks for and runs any method on the target object by the same name unless of the handlers called `event.preventDefault()`. So, `.trigger( "submit" )` will execute the `submit()` method on the element if one exists. When a `_default` hook is specified, the hook is called just prior to checking for and executing the element's default method. If this hook returns the value `false` the element's default method will be called; otherwise it is not. * @see \`{@link https://learn.jquery.com/events/event-extensions/#_default-function-event-jquery-event-data-object }\` */ - _default(event: Event, data: TData): void | false; + _default(event: TriggeredEvent, data: TData): void | false; } | { /** * jQuery calls a handle hook when the event has occurred and jQuery would normally call the user's event handler specified by `.on()` or another event binding method. If the hook exists, jQuery calls it _instead_ of that event handler, passing it the event and any data passed from `.trigger()` if it was not a native event. The `this` keyword is the DOM element being handled, and `event.handleObj` property has the detailed event information. @@ -4805,11 +4888,11 @@ $( "ul" ).click( handler ).find( "ul" ).hide(); * Based in the information it has, the handle hook should decide whether to call the original handler function which is in `event.handleObj.handler`. It can modify information in the event object before calling the original handler, but _must restore_ that data before returning or subsequent unrelated event handlers may act unpredictably. In most cases, the handle hook should return the result of the original handler, but that is at the discretion of the hook. The handle hook is unique in that it is the only special event function hook that is called under its original special event name when the type is mapped using `bindType` and `delegateType`. For that reason, it is almost always an error to have anything other than a handle hook present if the special event defines a `bindType` and `delegateType`, since those other hooks will never be called. * @see \`{@link https://learn.jquery.com/events/event-extensions/#handle-function-event-jquery-event-data-object }\` */ - handle(this: TTarget, event: Event & { handleObj: HandleObject; }, ...data: TData[]): void; + handle(this: TTarget, event: TriggeredEvent & { handleObj: HandleObject; }, ...data: TData[]): void; } | { - preDispatch(this: TTarget, event: Event): false | void; + preDispatch(this: TTarget, event: Event): false | void; } | { - postDispatch(this: TTarget, event: Event): void; + postDispatch(this: TTarget, event: Event): void; } | { [key: string]: never; }; @@ -4901,7 +4984,6 @@ $( "ul" ).click( handler ).find( "ul" ).hide(); declare const jQuery: JQueryStatic; declare const $: JQueryStatic; -// Used by JQuery.Event type _Event = Event; // region ES5 compatibility diff --git a/types/jquery/test/example-tests.ts b/types/jquery/test/example-tests.ts index 7ecb1733a7..673e549c31 100644 --- a/types/jquery/test/example-tests.ts +++ b/types/jquery/test/example-tests.ts @@ -384,7 +384,7 @@ function examples() { } function bind_2() { - function handler(event: JQuery.Event) { + function handler(event: JQuery.TriggeredEvent) { alert(event.data.foo); } @@ -830,7 +830,7 @@ function examples() { var len = kids.addClass('hilite').length; $('#results span:first').text(len); - $('#results span:last').text(event.target.tagName); + $('#results span:last').text((event.target as Element).tagName); event.preventDefault(); }); @@ -1614,12 +1614,12 @@ function examples() { function event_target_0() { $('body').click(function(event) { - $('#log').html('clicked: ' + event.target.nodeName); + $('#log').html('clicked: ' + (event.target as Node).nodeName); }); } function event_target_1() { - function handler(event: JQuery.Event) { + function handler(event: JQuery.TriggeredEvent) { var target = $(event.target); if (target.is('li')) { target.children().toggle(); @@ -3018,10 +3018,10 @@ function examples() { function jQuery_proxy_0() { var me = { type: 'zombie', - test: function(event: JQuery.Event) { + test: function(event: JQuery.TriggeredEvent) { // Without proxy, `this` would refer to the event target // use event.target to reference that element. - var element = event.target; + var element = event.target as Element; $(element).css('background-color', 'red'); // With proxy, `this` refers to the me object encapsulating @@ -3033,7 +3033,7 @@ function examples() { var you = { type: 'person', - test: function(event: JQuery.Event) { + test: function(event: JQuery.TriggeredEvent) { $('#log').append(this.type + ' '); }, }; @@ -3075,7 +3075,7 @@ function examples() { type: 'dog', // Note that event comes *after* one and two - test: function(one: typeof you, two: typeof they, event: JQuery.Event) { + test: function(one: typeof you, two: typeof they, event: JQuery.TriggeredEvent) { $('#log') // `one` maps to `you`, the 1st additional @@ -3796,7 +3796,7 @@ function examples() { } function on_1() { - function myHandler(event: JQuery.Event) { + function myHandler(event: JQuery.TriggeredEvent) { alert(event.data.foo); } diff --git a/types/jquery/test/learn-tests.ts b/types/jquery/test/learn-tests.ts index 523385b644..b1a0353b4e 100644 --- a/types/jquery/test/learn-tests.ts +++ b/types/jquery/test/learn-tests.ts @@ -35,7 +35,7 @@ function special() { bindType: "click", handle(event) { const handleObj = event.handleObj; - const targetData = jQuery.data(event.target); + const targetData = jQuery.data(event.target as Element); let ret = null; // If a multiple of the click count, run the handler diff --git a/types/jquery/test/longdesc-tests.ts b/types/jquery/test/longdesc-tests.ts index bb3bb4c83c..f3cf559638 100644 --- a/types/jquery/test/longdesc-tests.ts +++ b/types/jquery/test/longdesc-tests.ts @@ -538,7 +538,7 @@ function longdesc() { $('#foo').slideUp(300).delay(800).fadeIn(400); } - function delegate_0(elements: HTMLElement[], selector: string, events: any, data: any, handler: JQuery.EventHandler) { + function delegate_0(elements: HTMLElement[], selector: string, events: string, data: any, handler: JQuery.TypeEventHandler) { // jQuery 1.4.3+ $(elements).delegate(selector, events, data, handler); // jQuery 1.7+ @@ -2016,7 +2016,7 @@ function longdesc() { } function on_3() { - function greet(event: JQuery.Event) { + function greet(event: JQuery.TriggeredEvent) { alert('Hello ' + event.data.name); }