HTML ononline Event Attribute

If this site has been useful, we’d love your support! Consider buying us a coffee to keep things going strong!

Description

The HTML ononline event attribute is a global event attribute that triggers a JavaScript function when the browser starts to work online. This can be useful for notifying the user that their internet connection has been restored, or for automatically reloading a page or performing other actions when the user goes back online.

The ononline attribute can be used on any HTML element, but it is most commonly used on the <body> tag. For example, the following code would display an alert message when the browser goes online:

<body ononline="alert('You are now online!')">
</body>

The ononline event attribute is the opposite of the onoffline event attribute, which triggers a function when the browser goes offline.

Here is an example of a more complex use case for the ononline event attribute:

<body ononline>
  <script>
    // Check if the user is logged in.
    if (localStorage.getItem('isLoggedIn')) {
      // Reload the page to get the latest data from the server.
      location.reload();
    } else {
      // Display a login form.
      document.getElementById('loginForm').style.display = 'block';
    }
  </script>
</body>

In this example, the ononline event attribute is used to check if the user is logged in and reload the page if they are. If the user is not logged in, a login form is displayed. This ensures that the user is always logged in when they have an internet connection and they are always able to see the latest data from the server.

The ononline event attribute is a useful tool for creating web applications that are responsive to the user's internet connection status.

Syntax

<element ononline="script">

Values

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

Example

HTML

<!DOCTYPE HTML>

<html>

<html>

<body ononline="onFunction()" onoffline="offFunction()">



<p>Open the File menu and click on the “Work offline” button to switch between working on onlie and offline.</p>



<p><strong>Note:</strong>Ononline and onoffline events are supported only in Firefox and Internet Explorer from versions 8 to 10.</p>



<script>

function onFunction() {

    alert ("EXAMPLE: Your browser is online.");

}



function offFunction() {

    alert ("EXAMPLE: Your browser is offline.");

}

</script>



</body>

</html>

Result

Editor

Browser Support

The following information will show you the current browser support for the HTML ononline event attribute. Hover over a browser icon to see the version that first introduced support for this HTML event attribute.