+ 2
<!DOCTYPE html>
<html>
<body>
<font size ="6" color="yellow" align="center"><div id="rectangle"><p>Lucid</p></div></font>
<input type="text" id="myText" placeholder="Type a country here">
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
var cities = ["Dubai" , "London"];
//////SEARCH///////////
function myFunction() {
var x = document.getElementById("myText").value;
var found = false;
for(var i = 0; i < cities.length; ++i) {
if(x == cities[i]) {
alert("Loading results for " + x);
found = true;
break;
}
}
if(!found) {
alert("Please try again");
}
}
/////////////////////
</script>
</body>
</html>
0
Here you can use a placeholder instead of a value:
<input type="text" id="myText" placeholder="Type a country here">
In your script you're missing the closing curly brace for the function, the line alert(x) is what is outputting what is entered into the input box, (x == "cities") this is checking the value of x against the string "cities" not one of the values in the array cities. You need to access and compare against the values in the array instead. (x !== cities) is always true in this case as you're comparing a string to an array and seeing if they are not equal (which is true)
var cities = ["Dubai" , "London"];
function myFunction() {
var x = document.getElementById("myText").value;
alert(x); //<-- outputs what was entered
if(x == "cities") { // <-- comparing the input string to the string "cities"
alert("Loading results for " + x);
} else if(x !== cities) { // <-- this will always be true as your comparing a string to an array
alert("Please try again");
}
} //<-- missing