Dynamically initializing the Onclick event

Last post 07-09-2008 7:45 AM by NC01. 5 replies.

Sort Posts:

  • Dynamically initializing the Onclick event

    07-08-2008, 12:59 PM

    Hi:

         I have mentioned the java script code  below my need is i have to implement the same code  with  "For"   loop which inturn gives me the same result.I was tried but it gives me diffrent out .Can any one solve this issue.

     Thanks

     

    Code(Without For Loop):

    <html>
    	<head>
    		<script language='javascript'>
    			function init()
    			{
    				document.getElementById('btn' + 0).onclick = function(){display(0);};
    				document.getElementById('btn' + 1).onclick = function(){display(1);};
    				document.getElementById('btn' + 2).onclick = function(){display(2);};
    				document.getElementById('btn' + 3).onclick = function(){display(3);};
    				document.getElementById('btn' + 4).onclick = function(){display(4);};
    				document.getElementById('btn' + 5).onclick = function(){display(5);};
    				document.getElementById('btn' + 6).onclick = function(){display(6);};
    				document.getElementById('btn' + 7).onclick = function(){display(7);};
    			}
    		
    			function display(value)
    			{
    				alert('you clicked the Button' + value);
    			}
    		</script>
    	</head>
    	<body onload="init();">
    		<input type='button' id='btn0' value="Button0">
    		<input type='button' id='btn1' value="Button1">
    		<input type='button' id='btn2' value="Button2">
    		<input type='button' id='btn3' value="Button3">
    
    		<input type='button' id='btn4' value="Button4">
    		<input type='button' id='btn5' value="Button5">
    		<input type='button' id='btn6' value="Button6">
    		<input type='button' id='btn7' value="Button7">	
    	</body>
    </html>

     

     

     

     
    Filed under:
  • Re: Dynamically initializing the Onclick event

    07-08-2008, 1:52 PM
    Answer
    • All-Star
      74,705 point All-Star
    • NC01
    • Member since 08-26-2005, 3:33 PM
    • Posts 13,868
    • TrustedFriends-MVPs

    Like this?

    <script type="text/javascript">
    <!--
    function init()
    {
     for (var i=0; i<8; i++)
     {
      document.getElementById('btn' + i).displayValue = i;
      document.getElementById('btn' + i).onclick = function(){display(this.displayValue);};
     }
    }
    // -->
    </script>

    NC...

  • Re: Dynamically initializing the Onclick event

    07-08-2008, 2:33 PM

    Hi:

             It works greately!Thanks a lot. But I have struck with "displayvalue".What does that mean in this code .Cud u explain the code briefly.

     

    Thanks:

    Suresh

     

  • Re: Dynamically initializing the Onclick event

    07-08-2008, 2:36 PM
    • All-Star
      74,705 point All-Star
    • NC01
    • Member since 08-26-2005, 3:33 PM
    • Posts 13,868
    • TrustedFriends-MVPs

    The displayValue property is what will be displayed when the alert in the display function is invoked.

    NC...

  • Re: Dynamically initializing the Onclick event

    07-08-2008, 3:18 PM

    Hi:

             Thank u.Ur code works in normal codition . Now I have set "SetIntervel" Property.Here is the code

    var i;moveTimer = new Array(8); for(i=0;i<8;i++)

    {

    moveTimer[i] = window.setInterval(function() {moveSlideLeft('img' + i);},50);

    }

        Cud u plz tell me  how to apply ur previous logic here.

     

     Thanks:

    Suresh

     

  • Re: Dynamically initializing the Onclick event

    07-09-2008, 7:45 AM
    Answer
    • All-Star
      74,705 point All-Star
    • NC01
    • Member since 08-26-2005, 3:33 PM
    • Posts 13,868
    • TrustedFriends-MVPs

    Not the same, so you can't do it that way. When you create a function that way, the i variable will be the last value before exiting the loop (in this case 8). I would need to know exactly what you are trying to accomplish to help with this one. Why do you need an array of interval IDs (moveTimer = new Array(8))? Why are you creating a new function on each iteration? Why are you attempting something this complex when you don't understand JavaScript? Why not learn JavaScript first? Have you Googled for existing code that does the same thing that you want to do?

    If you are attempting something like a slideshow, see here: http://aspnet.4guysfromrolla.com/articles/070704-1.aspx

    NC...

Page 1 of 1 (6 items)