[Autocomplete] Email Domain Suggestions Like Gmail, Outlook, or More | email-genie

Email Genie allows auto-completion in the email field by providing a list of domain suggestions (gmail.com, outlook.com, etc.). This package is lightweight, flexible, compatible with libraries (jQuery, etc.) / frameworks (React, Angular, Vue, etc.), and maximizes native behaviors on desktop and mobile browsers.

Email Genie is a small email domain name auto-completion library that displays a list of domain suggestions as you type the email username into the email input.

👍 Lite 5kb (2kb Gzipped) ⚡ Fast Native JavaScript 🚫 No Dependencies 🚫 No HTML Wrapper 🚫 No CSS injected.

Must Read: A JavaScript Library to Create Input Fields That Accept Multiple Email Addresses | MeiMei

How to make use of it:

1. Install and import the Email Genie.

$ npm i email-genie
import EmailGenie from 'email-genie';

2. Or insert them email-genie.min.js into the document.

<script src=”/dist/email-genie.min.js”></script>

3. Create an e-mail input on the web page.

<input type="email" class="email" />

4. Initialize the Email Genie.

var field = new EmailGenie('.email');

5. Append extra domain names to the domain listing.

var field = new EmailGenie('.email',{
    domains: ['gmail.com', 'outlook.com', 'hotmail.com', 'msn.com', 'live.com', 'googlemail.com', 'yahoo.com', 'me.com', 'icloud.com']

6. Determine whether or not to the built-in domain listing.

var field = new EmailGenie('.email',{
    domains: ['gmail.com', 'outlook.com', 'hotmail.com', 'msn.com', 'live.com', 'googlemail.com', 'yahoo.com', 'me.com', 'icloud.com'],
    overrideDomains: true,
    insert: 'afterend' // 'beforebegin', 'afterend', 'documentend'


Email Domain Name Autocomplete


Must Read: Draggable Drag-n-Drop Email Editor Component for Vue.js

domains[‘gmail.com’, ‘outlook.com’, ‘hotmail.com’, ‘msn.com’, ‘live.com’, ‘googlemail.com’, ‘yahoo.com’, ‘me.com’, ‘icloud.com’][]An array of domain suggestions. (By default, this array will be added to the default domain suggestions. View overrideDomains option to override instead.)
overrideDomainsfalseBoolean (true/false)Whether the domain suggestions array should override the default one.
insert‘afterend’‘beforebegin’, ‘afterend’, ‘documentend’Where the data list generated should be inserted: Before the input, after the input, and at the end of the document.

See Demo And Download


Official Website(smnarnold): Click Here

This superior jQuery/javascript plugin is developed by smnarnold. For extra Advanced Usage, please go to the official website.

Related Posts


Create Side Sliders Input Values Using Mouse Drag | Pointer Lock

HTML Range Slider is a lightweight library to create side sliders to adjust values easily and precisely by making use of the Pointer Lock API. Side Slider…


Smooth and Lightweight Parallax Scroll Library in Pure Javascript

Lightweight and seamless parallax scrolling library implemented in pure javascript using hardware acceleration for additional performance. Main Features Extremely lightweight with no dependencies A few kilobytes of pure…


How to Convert Form Data to JSON with HTML Forms | FormsJS

FormsJS is a simple-to-use JavaScript library that covers type subject values to JSON in real time. The items containing the data category will be analyzed automatically. It…


A Small jQuery Extension to Convert An Editable HTML Table

Editable Table is a small jQuery extension to convert an editable HTML table for fast data entry and validation. A small jQuery extension to convert a static…


Simple jQuery Plugin for Embedding YouTube Videos As Cover Background

jquery.youtube-background is a jQuery plugin built to facilitate YouTube embeds as cover wallpaper using the YouTube Embed API. There is another jQuery Youtube Video Background plugin that…


Interactive Data Table Generator with JS/jQuery and JSON | Tabulator

Tabulator allows you to create interactive tables in seconds from any HTML Table, JavaScript array, AJAX data source, or JSON format data. Just include the library in your…

Leave a Reply

Your email address will not be published. Required fields are marked *