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
  1. #1
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help to draw number triangle in div use javascipt

    I need to draw like image 1 in file attach.
    But after i write code:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    <script type="text/javascript">
    function Ve()
    {
    	var n = document.getElementById("txtGiatri").value;
    	var i,j; 
    	
       for(i=1;i<=n;i++)
       {
       	for(j=0;j<n-i;j++)
          document.getElementById ("place").innerHTML +="&nbsp;";
       	for(j=i;j>0;j--)
        		{
          		document.getElementById ("place").innerHTML +=j;
    			
             }
          document.getElementById ("place").innerHTML +="<br/>";
       }
    
    }
    </script>
    <body>
    <table>
    	<tr>
        	<td><input name="txtGiatri" type="text" id="txtGiatri" /></td>
            <td><input name="btnVe" type="button" value="Ve" onclick="Ve();" /></td>
        </tr>
    	<tr>
        	<td><div id="place"></div></td>
            <td></td>
        </tr>
    </table>
    </body>
    </html>
    i only have like image 2.

    How i fixed it?
    Attached Thumbnails Attached Thumbnails Help to draw number triangle in div use javascipt-1.jpg   Help to draw number triangle in div use javascipt-2.jpg  

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,503
    Thanks
    3
    Thanked 500 Times in 487 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    <script type="text/javascript">
    function Ve(){
     var n = document.getElementById("txtGiatri").value;
     var i,j,k,ary;
     for(i=1;i<=n;i++){
      for(j=0;j<n-i;j++){
       document.getElementById ("place").innerHTML +="&nbsp;";
      }
      ary=[];
      for(j=i;j>i/2;j--){
       ary.push(j%10)
       document.getElementById ("place").innerHTML +=j%10;
      }
      ary.length-=i%2
      for(k=ary.length-1;k>=0;k--){
       document.getElementById ("place").innerHTML +=ary[k];
      }
      document.getElementById ("place").innerHTML +="<br/>";
     }
    }
    
    </script>
    <body>
    <table>
    	<tr>
        	<td><input name="txtGiatri" type="text" id="txtGiatri" /></td>
            <td><input name="btnVe" type="button" value="Ve" onclick="Ve();" /></td>
        </tr>
    	<tr>
        	<td><div id="place"></div></td>
            <td></td>
        </tr>
    </table>
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok, thanks for help!

    I've already finish code

    Code:
    <center>
    <input type="text" id="tamgiac_2" /><input type="button" value="Ve tam giac" onclick="drawtamgiac2()" />
    </center>
    <div id="tamgiac_id_2" style="text-align:center"></div>
    <script language="javascript">
    	function drawtamgiac2(){
    		var soluong = parseInt(document.getElementById("tamgiac_2").value);
    		var html = "";
    		var current_i;
    		for (i=0; i<soluong; i++){
    			for (j=0; j<=i; j++){
    				current_i = ((i+1 - j));
    				
    				if (current_i <= (i+1)/2) current_i = (j+1) ;
    				
    				current_i = current_i % 10;
    				
    				html += current_i  + " &nbsp; ";
    			}
    			html += "<br>";
    		}
    		document.getElementById("tamgiac_id_2").innerHTML = html;
    	}
    	
    </script>


  •  

    Posting Permissions

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