Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3

Thread: writing in div

  1. #1
    New Coder
    Join Date
    Oct 2004
    Posts
    37
    Thanks
    0
    Thanked 1 Time in 1 Post

    Arrow writing in div

    Hi,
    This script is supposed to write ten lines of randomly-generated numbers in <mydiv> and when the counter is grater than ten
    I need to jump to <mydiv2> and keep writing...The problem is it is still writing <mydiv>
    How can I disabled writing <mydiv> and keep writing <mydiv2> ?
    thanks


    PHP Code:
    <html>

    <
    head>
     
      <
    script>
    var 
    con=0;
     var 
    stopit=setInterval("yaz()",1000)
      function 
    yaz()
      {

    con++;
      for(var 
    m=1;m<=6;m++)    
      {
      var 
    rno=Math.floor(Math.random()*50)+1;
     

      
    document.getElementById('mydiv').innerHTML+=rno+",";
      
    document.getElementById('but1').value=con;
    if(
    con>=10)
    {

    document.getElementById('mydiv2').innerHTML+=rno+",";
    }
    if(
    con>=20)
    {

    clearInterval(stopit)
    }
      }
       
    document.getElementById('mydiv').innerHTML+="<br>";
      
    document.getElementById('mydiv2').innerHTML+="<br>";
      }
      
      
    </script>
    </head>

    <body bgcolor=silver>
         
     <input type=button id=but1 value="lets start" onClick="yaz()"> 
            

    <div id="mydiv" style="position:absolute;top:50;left:20;background-color:white;">
    <div id="mydiv2" style="position:absolute;top:50;left:200;background-color:pink;">
        
    </body>
    </html> 

  • #2
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    If you only want 10 lines in mydiv you need another if statement at the beginning, like this;
    Code:
    <html> 
    <head> 
      
      <script type="text/javascript"> 
     var con=0; 
     var stopit=setInterval("yaz()",1000) 
     function yaz() 
     {
      var rno;
      var but1 = document.getElementById('but1');
      var mydiv = document.getElementById('mydiv');
      var mydiv2 = document.getElementById('mydiv2');
      con++; 
      for(var m=1;m<=6;m++)     
      {
       but1.value=con;
       rno=Math.floor(Math.random()*50)+1; 
       if(con<10){
        mydiv.innerHTML+=rno+","; 
       }
       else if(con>=10 && con<20) 
       { 
        mydiv2.innerHTML+=rno+","; 
       } 
       else if(con>=20) 
       { 
        clearInterval(stopit);
        break; //might as well break out of the for loop now.
       } 
      }
      mydiv.innerHTML+="<br>";
      mydiv2.innerHTML+="<br>";
     }
      </script> 
    </head> 
    <body bgcolor=silver> 
          
     <input type=button id=but1 value="lets start" onClick="yaz()">  
             
    <div id="mydiv" style="position:absolute;top:50;left:20;background-color:white;"></div>
    <div id="mydiv2" style="position:absolute;top:50;left:200;background-color:pink;"></div>
    </body> 
    </html>
    I've also made it more efficient by assigning the references to the divs at the beginning of the function.

  • #3
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Code:
    <html> 
    <head> 
    <script type="text/javascript"> 
    var con=0; 
    var stopit=setInterval("yaz()",1000) ;
    function yaz() 
    { 
      con++; 
      for(var m=1;m<=6;m++)     
      { 
        var rno=Math.floor(Math.random()*50)+1; 
        if (con>20) { 
          clearInterval(stopit) ;
          return;
        } 
        else if(con<=10) 
        { 
          document.getElementById('mydiv').innerHTML+=rno+","; 
        } 
        else if (con>10)
        {
           document.getElementById('mydiv2').innerHTML+=rno+","; 
        }
      } 
      if(con<=10) document.getElementById('mydiv').innerHTML+="<br>"; 
      else if (con>10) document.getElementById('mydiv2').innerHTML+="<br>"; 
      document.getElementById('but1').value=con;
    } 
       
    </script> 
    </head> 
    
    <body bgcolor=silver> 
          
    <input type=button id=but1 value="lets start" onClick="yaz()">          
    
    <div id="mydiv" style="position:absolute;top:50;left:20;background-color:white;"></div> 
    <div id="mydiv2" style="position:absolute;top:50;left:200;background-color:pink;"></div> 
         
    </body> 
    </html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •