If statement error when it changed to case sensitive

Question

I created code to check a particular value in the input search box. If it is, the web will focus on the searched element.

My html

<input type="search" id="search-box" placeholder="Search">
<button type="submit" id="searchbar" onclick="Focus()"</button>Search</button>

My JavaScript


function Focus(){
    var search = document.getElementById("search-box").value;
    

    if(search == "about"){
            document.getElementById("about").focus();
        }
        else{
            alert("Not Found");
        }
}

This is working, but if I change to this if(search == "about" || “About”) Then the else statement is not working.

Is there any other method to make about case sensitive Like About, AbOut, aBoUT, etc all are equal

Because that’s the wrong syntax. It should be `if(search == "about" || search == "About")` (also you’re using smart quotes). A better way is to convert `search` to lowercase first before comparison so you don’t need to compare it against all combinations of upper and lowercases. — Terry, Sep 14 '21 at 05:07
I can't comment, so... if you mean case insensitive... https://stackoverflow.com/questions/2140627/how-to-do-case-insensitive-string-comparison — Antidisestablishmentarianism, Sep 14 '21 at 05:10

Ora Walters · Answer 1 · 2021-09-14T05:14:34.537

0

You could use search.toLowerCase() == "about" to see if it is a case insensitive match. Make sure you're using the right quotation marks. As you've used curly quotes in some instances.

edited Sep 14 '21 at 05:14

answered Sep 14 '21 at 05:08

Ora Walters

98
1
11

score 0 · Answer 2 · answered Sep 14 '21 at 05:09

0

You can always do:

const toCompare = 'AboUT';

if(toCompare.toLowerCase() === 'about'){
 // --
}else{
 // --
}

answered Sep 14 '21 at 05:09

tnchalise

1,573
2
18
38

score 0 · Answer 3 · answered Sep 14 '21 at 05:10

You can use the if statement as below.

if (search == "about" || search == "About"){}

But as you mentioned, there can be many combinations of capitals and simples. So you should convert all the text to simple (convert to a standard format) and do the check like below.

if (search.toLowerCase() == "about"){}

score 0 · Answer 4 · answered Sep 14 '21 at 05:14

if(search == "about" || “About”) will always evaluate true as "About" is a non empty string and is Truthy. You need to write if(search == "about" || search == “About”)

Alternatively, a better syntax is to not make it case-sensitive, and write

if(search.toLowerCase() == "about")

If statement error when it changed to case sensitive

4 Answers4