Jump to content

onload event


s_avinash_s
 Share

Recommended Posts

Hi

I am trying to use onload event, but it is not working.

i will receive value from 

document.getElementById("hw_maj").value = this.responseText;

any issue with my code.

<p id="hw_maj"></p>
     <body onload="hw_major()"> </body>
    <script>

    function hw_major() {
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {	  
          document.getElementById("hw_maj").value = this.responseText; 
          document.getElementById("myText_hw_maj").value = this.responseText; 	  
        }
      };
    xhttp.open("GET", "hw_ver.txt", true);
    xhttp.send();
    }
    </script>


   <h3>HW version:
   
   <input type="text" id="myText_hw_maj" size ="10" style="border:none;font-size:27pt;"></h3>

 

Link to comment
Share on other sites

Hi 

when i use 

it prints on both....

I need only on text box

document.getElementById("hw_maj").innerHTML = this.responseText; 
          document.getElementById("myText_hw_maj").innerHTML = this.responseText; 	

and 

 <input type="text" id="myText_hw_maj" size ="10" style="border:none;font-size:27pt;"></h3>

 

 

But if use, it prints only in textbox but occupies..i need to avoid it

        if (this.readyState == 4 && this.status == 200) {	  
          document.getElementById("hw_maj").innerHTML = this.responseText; 
          document.getElementById("hw_maj").style.visibility = "hidden";
          	  
        }
      };
    xhttp.open("GET", "hw_ver.txt", true);
    xhttp.send();
    }

    </script>


   <h3>HW version:
   
   <input type="text" id="hw_maj" size ="10" style="border:none;font-size:27pt;"></h3>

 

Edited by s_avinash_s
Link to comment
Share on other sites

If you don't need it in the paragraph element, then remove the line of code that does that. Just delete this line, but keep all the rest of the code the same:

document.getElementById("hw_maj").innerHTML = this.responseText;

You need to understand what each line of code is doing.

You should also delete that <p> element from your HTML since you're not using it.

Link to comment
Share on other sites

Hi

I have a code where 3 onload functions are being used.

but only first one displays in text box and other 2 not displaying.

I am not getting what is wrong

<body onload="abc()"> </body>
    <script>

    function abc() {
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {	  
          
          document.getElementById("temp1").value = this.responseText; 	  
        }
      };
    xhttp.open("GET", "temp1", true);
    xhttp.send();
    }

    
    </script>

  <br> <br> 
  
   <h3>SW version:
   
   <input type="text" id="temp1" size ="10" style="border:none;font-size:27pt;"></h3>
  
     <body onload="def()"> 
    <script>

    function def() {
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {	  
          document.getElementById("temp2").value = this.responseText;        	  
        }
      };
    xhttp.open("GET", "temp2", true);
    xhttp.send();
    }

    </script>
</body>

   <h3>HW version:
   
   <input type="text" id="temp2" size ="10" style="border:none;font-size:27pt;"></h3>

  
     

    
     <br> 
     
      
     <body onload="ghi()"> </body>
    <script>

    function ghi() {
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {	  
          
          document.getElementById("temp3").value = this.responseText; 	  
        }
      };
    xhttp.open("GET", "temp3", true);
    xhttp.send();
    }

    
    </script>

      <h3>Version Info:
   <input type="text" id="temp3" size ="10" style="border:none;font-size:27pt;"></h3>
   <br>

 

Link to comment
Share on other sites

Hi

Thanks for the info.

I got some info about addeventlistener and tried the following code.

when i click  button it displays the value.

Without clicking, is it possible to load the value only once.

<!DOCTYPE html>
<html>
<body>
<button id="myBtn">Try it</button>

<p id="demo">

<script>
var x=100;
document.getElementById("myBtn").addEventListener("click", myFunction);

function myFunction() {
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...