jQuery Alert | How to use Alert box in jQuery with code and running example

jQuery Alerts

Alerts or dialogue boxes are widely used these days, in order to interact with visitors of websites. For example, filling an online form or Alerting before exiting to another page. The jQuery provides ways to make fancy alert boxes to be used for a website.

This chapter will take you through how you can use jQuery to design custom alert boxes that you can use for different purposes in your website.

You can see alert box codes below or download required files to your computer and then copy HTML code to run it from your computer.

Download four dependency files here

You have to place all 4 files included in downloaded zip file to same location as your code file is for below examples.

Example 1: Basic jquery Alert Box

jQuery alert

Experience this example online

Example 2: Confirmation jquery Alert Box

Experience this example online

 Example 3: Prompt jquery Alert Box

This can be used for scenarios where you need user input values, for example, Your Name or age or location before proceeding to next step.

Experience this example online

Example 4: Including HTML elements into jquery alerts

You can include HTML attributes like bold, italic, underline even links <a> into your alert boxes to make it more interactive and appealing. Below example shows how to include bold, italic underline and a hypertext <a> elements into jquery alert.

jQuery alert html

Experience this example online