Javascript: check if word in input is placed after an other word-CodePudding

I have a question but I can't find the answer for my problem. Hope you can help me!

Here's my HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="text" id="one">
    <input type="text" id="two">

Here's my Javascript:

$('#one').on('input', function(){
var value = $(this).val();
if (value.includes("@") && value.includes(".com"))
{
   $('#two').focus();
   }
  });

Demo

What this script does
I'm making a login form where the input focuses on the second input when a user has typed his email. In my code: it focuses on the next input when the first input detects an '@' symbol and the text '.com'.

But here's the problem
Lets say your email is: '[email protected]'. My script focuses on the second input after you typed the '@' symbol, because the input already contains '.com' and '@'.

My Question
What javascript do I need to add that checks if '.com' is typed after the '@' symbol?

CodePudding user response：

You could use regex: @.*\.com

if (/@.*\.com/.test(value))

CodePudding user response：

You can use indexOf() (docs)

if (value.includes("@") && value.includes(".com") && value.indexOf("@") < value.indexOf(".com"))

I just find both locations and compare them. @ should be found in an earlier index than .com. However, here lies another problem in your code. That is not all emails ended with .com. Here is some solution to solve the problem or you can just use this one

if (value.includes("@") && value.includes(".") && value.indexOf("@") < value.indexOf("."))

CodePudding user response：

It sounds like you want to update focus once the user has entered a valid email address. For tips on that, check out the answers to this classic question: What's the best way to validate an email address in JavaScript?

To answer your question more directly, you could create a regular expression (RegExp) to check if .com is typed after the @ symbol.

const comAfterAtSymbol = new RegExp('@.*\.com')
if (comAfterAtSymbol.test(value)) {
  ...
}