document.getElementById('textbox').value stopped working
Question
my code is very simple. I want the user to be able to type in a restaurant name and have my function tell them whether that restaurant serves Coke or Pepsi products. It worked fine an hour ago, but stopped working. Now, it shows the work "Pepsi" no matter what you type in. My guess is that there is something wrong with the if statements.
<html>
<noscript><b><center><font size="16">This app requires JavaScript to be enabled. Enable JavaScript on your browswer to make it work.</font></center></b></noscript>
<center>
<form onsubmit="popproducts()">
<br><br><br><br><br><br><br><br><br>
<input id="textbox" type="text" style="height: 100px; width: 500px" value=""></input>
</br></br></br></br></br></br></br></br></br>
</form>
</center>
<script type="text/javascript">
function popproducts()
{
if(document.getElementById('textbox').value == "Cougars" || "Kane County Cougars" || "Cougars Baseball")
{
document.write('<center><br><font color="#0000FF" size=20></b>Pepsi</b></font></br></center>');
document.write('<br><br><center><form><input type="button" style="height: 100px; width: 100px" value="Back" onClick="history.go(-1);return true;"></form></center></br></br>');
}
if(document.getElementById('textbox').value == "Burge" || "Iowa" || "University of Iowa")
{
document.write('<center><br><font color="#FF0000" size=20><b>Coke</b></font></br></center>');
document.write('<br><br><center><form><input type="button" style="height: 100px; width: 100px" value="Back" onClick="history.go(-1);return true;"></form></center></br></br>');
}
}
</script>
</html>
5 answers
solution1
3 2012-12-27 23:50:48
It's the line:
if(document.getElementById('textbox').value == "Cougars" || "Kane County Cougars" || "Cougars Baseball")
It should be:
if(document.getElementById('textbox').value == "Cougars" || document.getElementById('textbox').value == "Kane County Cougars" || document.getElementById('textbox').value == "Cougars Baseball")
The first part evaluates as true or false depending on what you type, but the second and third will always evaluate as true .
solution2
1 2012-12-27 23:51:45
This is your issue:
if(document.getElementById('textbox').value == "Cougars" || "Kane County Cougars" || "Cougars Baseball")
When you have an if statement with the or operator || , the praser interprets it as if it was:
if(doc....value == "Cougars || "Kane Country Cougars" != false...)
In other words, the if statement is always true because the string "Kane Country Cougars" isn't false. To fix it, you should do this:
var val = document.getElementById('textbox').value;
if(val == "Cougars" || val == "Kane County Cougars" || val == "Cougars Baseball")
solution3
1 2012-12-27 23:56:33
All other answers are fine but here's how I usually do it:
var value = document.getElementById('textbox').value;
if ( /^Cougars|Kane County Cougars|Cougars Baseball$/.test( value ) ) {
...
}
solution4
0 2012-12-27 23:51:22
You're using the || operator incorrectly. If you want to check if a value equals one of many values, you have to explicitly convey that. For example:
if ( a == b || a == c || a == d )
Doing it the other way will cause the unexpected behavior you were experiencing.
solution5
0 2013-01-01 08:00:18
try this,
var value = document.getElementById('textbox').value;
if (value == 'Cougars' || value == 'Kane County Cougars' || value == 'Cougars Baseball')
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.