Question

This question relates to Javascript. Could you please show me why my code is not working?...

This question relates to Javascript.

Could you please show me why my code is not working? I want to create 2 text boxes and have the user enter something into both of them. If the text entered into both boxes is identical the a green message is made visible. If the boxes are different a red message is made visable. Please keep it simple because I am new to javascript.

<html>
<head>
      
       <title></title>
      
<script>
      
      
       function boxTest(){
           var text1 = document.getElementById("box1");
           var text2 = document.getElementById("box2");
          
           if(text1==text2){
               document.getElementById("greenText").innerHTML.style.visibility="visible";
           }
           else{
               document.getElementById("redText").innerHTML.style.visibility="visible";
           }
       }
                      
</script>
      
</head>

<body>
       <h1 style="color:blue">Input some text into each box</h1>
       <input id="box1" type="text">
       <input id="box2" type="text">
       <input id="submit" onClick="boxTest()" type="submit" value="submit">
       <h1 id="greenText" style="color:green;visibility: hidden">"Match!"</h1>
       <h1 id="redText" style="color:red;visibility: hidden">"Mismatch!"</h1>
   </body>
</html>

0 0
Add a comment Improve this question Transcribed image text
Answer #1

Code

<html>
<head>
  
<title></title>
  
<script>
  
  
function boxTest()
   {
var text1 = document.getElementById("box1").value;
var text2 = document.getElementById("box2").value;   
if(text1==text2)
       {
               y=document.getElementById('redText');
               y.style.visibility = 'hidden';
               x=document.getElementById('greenText');
               x.style.visibility = 'visible';
}
else
       {
               x=document.getElementById('greenText');
               x.style.visibility = 'hidden';
               y=document.getElementById('redText');
               y.style.visibility = 'visible';
}
}
  
</script>
  
</head>

<body>
<h1 style="color:blue">Input some text into each box</h1>
<input id="box1" type="text">
<input id="box2" type="text">
<button onclick="boxTest()">Submit</button>
   <h1 id="greenText" style="color:green;visibility: hidden">"Match!"</h1>
<h1 id="redText" style="color:red;visibility: hidden">"Mismatch!"</h1>
</body>
</html>

outputs

If you have any query regarding the code please ask me in the comment i am here for help you. Please do not direct thumbs down just ask if you have any query. And if you like my work then please appreciates with up vote. Thank You.

Add a comment
Know the answer?
Add Answer to:
This question relates to Javascript. Could you please show me why my code is not working?...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
  • This question relates to Javascript. Could you please show me why my code is not working?...

    This question relates to Javascript. Could you please show me why my code is not working? I want to create 2 text boxes and have the user enter something into both of them. If the text entered into both boxes is identical the a green message is made visible. If the boxes are different a red message is made visable. Please keep it simple because I am new to javascript. <html> <head>               <title></title>        <script>...

  • This question relates to JavaScript. Could you please show me how to get my code below...

    This question relates to JavaScript. Could you please show me how to get my code below working. Please keep it simple. The code has a green square image.  When it is clicked the function generates a random number from 1-3. If the number generated is '1' then the green square is replaced by a picture of a tree. Please keep it as simple as possible because I am new to coding. Thanks. <html> <head>              <title></title>        <script>...

  • could you please show me what I am doing wrong in the Javascript code below. <html>...

    could you please show me what I am doing wrong in the Javascript code below. <html>   <head> <meta charset="UTF-8"> <title></title> <style> #mytext { color: white; text-align: center; } </style> <script> var words = "The cat sat on the mat"; document.writeln("id='mytext"+ words '); </script>   </head>   <body>   </body> </html>

  • NEED HELP with HTML with Javascript embedding for form validation project below. I have my code...

    NEED HELP with HTML with Javascript embedding for form validation project below. I have my code below but I'm stuck with validation. If anyone can fix it, I'd really appreciate. ****************************************************************************** CODE: <!DOCTYPE html> <!-- To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. --> <html> <head> <title>Nice</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script> var textFromTextArea; function getWords(){ var text =...

  • LANGUAGE JAVASCRIPT, PHP Need help with PHP and ajax code. The user needs to login but,...

    LANGUAGE JAVASCRIPT, PHP Need help with PHP and ajax code. The user needs to login but, I keep getting an error that I coded "Wrong username and password!" ***PLEASE DONT GIVE ME A NEW CODE THAT IS NOWHERE NEAR THE CODE I SUBMITTED***** PLEASE LOOK AT THE CODE AND SEE ANY ISSUES login.html <!DOCTYPE html> <html> <head> <title>login popup</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <style type="text/css"> body { background-color: white; } </style> </head> <body> <center> <h1 style="text-align: center;"> Login </h1> <form>             Login ID:...

  • For this discussion, you will be working with regular expressions. Please create a regular expression that...

    For this discussion, you will be working with regular expressions. Please create a regular expression that requires passwords to begin with an uppercase letter, followed by five lowercase letters, followed by a one-digit number (0-9), and ending with one symbol (@, $, %, or &). You may use the index.htm file included with this discussion to test your regular expression. Note that the index.htm file contains HTML and JavaScript. To test your regular expression, simply assign your regular expression to...

  • I am working on a normal javascript program where i have to take two names and...

    I am working on a normal javascript program where i have to take two names and put them in array and print out in sorted order.But,when the user clicks the print button it should show the output,but if user clicks second time,it should start again(basically reload the page).I have done the part about userinput and sorting and printing,but couldn't get the function of when user clicks button second time. <!DOCTYPE html> <html> <body> <input type="text" id="Name1" value=""><br> <input type="text" id="Name2"...

  • I need to complete 3 validation cases in this Javascript code. I need to validate email,...

    I need to complete 3 validation cases in this Javascript code. I need to validate email, phone and street address. How would I go about validating these 3 cases in this code: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Week 10: Regular Expressions</title> <style type="text/css"> span { padding: 2px; } .success { color: #008000; background: #99cc99; } .failure { color: #ff0000; background: #ff9999; } </style> <script type="text/javascript"> function validateInput(form) { var result0 = document.getElementById('result0'), result1 = document.getElementById('result1'), result2 = document.getElementById('result2'),...

  • The code below modifies the CSS style on button click. Give the output of the code...

    The code below modifies the CSS style on button click. Give the output of the code and modify the code such that background color of title should also be modified . <!DOCTYPE html> <html lang="en"> <head> <title>JavaScript and HTML</title> <meta charset="utf-8"/> <style> h1 { color:blue; background-color:lightGreen; border:12px solid green; padding: 5px; border-radius: 15px; text-align: center; } p, h1 { } } </style> <script> function changeTitleCSSStyle() { var title = document.querySelector("#mainTitle"); title.style.color = 'black'; title.style.border = "5px dashed red"; } </script>...

  • in the following java script code follow the instructions provided <!DOCTYPE html> <html> <head> <!-- JavaScript...

    in the following java script code follow the instructions provided <!DOCTYPE html> <html> <head> <!-- JavaScript 6th Edition Chapter 5 Hands-on Project 5-2 Author: Date:    Filename: index.htm --> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Hands-on Project 5-2</title> <link rel="stylesheet" href="styles.css" /> <script src="modernizr.custom.05819.js"></script> </head> <body> <header> <h1> Hands-on Project 5-2 </h1> </header> <article> <h2>Change of address form</h2> <form> <fieldset id="contactinfo"> <label for="addrinput"> Street Address </label> <input type="text" id="addrinput" name="Address" /> <label for="cityinput"> City </label> <input type="text" id="cityinput" name="City"...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT