HTML ontouchend Event Attribute

Description

The ontouchend HTML event attribute is a JavaScript event that fires when a user removes their finger from an element on a touch-sensitive device. This event is useful for creating interactive elements that respond to user touch input.

For example, you could use the ontouchend event to create a button that changes color when the user taps on it. Or, you could use it to create a slider that allows the user to adjust a value by dragging their finger across the screen.

The ontouchend event is supported by all modern browsers, including Chrome, Firefox, Safari, and Edge.

To use the ontouchend event, you can either add it as an attribute to an element in your HTML code, or you can use the addEventListener() method in JavaScript.

For example, the following code would add an ontouchend event listener to a button element:

<button ontouchend="myFunction()">Click me!</button>

The following code would add an ontouchend event listener to a button element using JavaScript:

document.querySelector("button").addEventListener("touchend", myFunction);

When the user removes their finger from the button, the myFunction() function will be called.

The ontouchend event provides a number of properties that can be used to get information about the touch event. For example, the touches property provides a list of all the touch points that are currently active on the screen.

Syntax

<element ontouchend="script">

Values

scriptThe name of the script to use when the event has been triggered.

Example

HTML

<button id="myButton" ontouchend="changeColor()">Touch me!</button>



<script>

function changeColor() {

  document.getElementById("myButton").style.background= "red";

}

</script>

Result

Editor