Tell us what’s happening:
Case 35 and 36 give Reference Errors, saying resultsDiv is not defined, not sure why it’s giving these messages
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="styles.css" />
<title>
Validating Phone Numbers
</title>
</head>
<body>
<input id="user-input">
<button id="check-btn">This better be a phone number, I swear to God</button>
<button id="clear-btn">Rinse to repeat</button>
<div id="results-div"></div>
<script src="script.js"></script>
</body>
</html>
/* file: script.js */
//relevant info declared
const input=document.getElementById("user-input");
const button = document.getElementById("check-btn");
const reset = document.getElementById("clear-btn");
const result = document.getElementById("results-div");
//button logic
button.addEventListener("click",()=>{
if(input.value==="")
{
alert("Please provide a phone number")
}
else
{
//determines output to result
if(telephoneCheck(input.value))
{
result.innerHTML=`Valid US number: ${input.value}`;
}
else
{
result.innerHTML=`Invalid US number: ${input.value}`;
}
}
})
//reset button
reset.addEventListener("click",()=>{result.innerHTML=""});
//regex function
function telephoneCheck(str) {
const tester = /^1?[-\s]?((\([0-9]{3}\))|([0-9]{3}))[-\s]?([0-9]{3})[-\s]?([0-9]{4})$/
return tester.test(str);
}
/* file: styles.css */
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:135.0) Gecko/20100101 Firefox/135.0
Challenge Information:
Build a Telephone Number Validator Project - Build a Telephone Number Validator