www.webdeveloper.com
Results 1 to 2 of 2

Thread: A problem with buttons and javascript

  1. #1
    Join Date
    Feb 2010
    Posts
    2

    A problem with buttons and javascript

    Hey, I'm new to JS and I was wondering if its possible in JS to make a form that when you click on a button it adds a value to a preset variable, (x=0, or that it multiples x by a certain value (or anything that can change the vaule of x). So far I've touched small bits of php in my course but trying to paly around with JS a bit.

    my mind set with it is something like this.
    Code:
    <form id="form">
    <script type="text/javascript">
    var x = 0;
    function count (x)
    	{
    	return x+=1;
    	}
    
    	document.write(x);
    </script>
    
    
    <input type="button" Value="counter" size=12 onClick=count()>
    <script type="text/javascript">
    document.write(document.solas.value);
    </script>
    
    </form>
    just playign aroudn with some things atm so any help would be appretiated.

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,259

    Lightbulb Consider this ...

    Try this ...
    Code:
    <html>
    <head>
    <title>Button Changes</title>
    <script type="text/javascript">
    http://www.webdeveloper.com/forum/showthread.php?t=225370
    
    function Add() { 
      var N = parseFloat(document.getElementById('Accum').value);
      if (isNaN(N)) { alert('Math requires numbers'); return; }
      document.getElementById('Accum').value = N + 1;
    }
    
    function Sub() { 
      var N = parseFloat(document.getElementById('Accum').value);
      if (isNaN(N)) { alert('Math requires numbers'); return; }
      document.getElementById('Accum').value = N - 1;
    }
    
    function Mult() { 
      var N = parseFloat(document.getElementById('Accum').value);
      if (isNaN(N)) { alert('Math requires numbers'); return; }
      document.getElementById('Accum').value = N * 5;
    }
    
    function Div() { 
      var N = parseFloat(document.getElementById('Accum').value);
      if (isNaN(N)) { alert('Math requires numbers'); return; }
      document.getElementById('Accum').value = N / 5;
    }
    
    </script>
    </head>
    <body>
    <form id="myForm" action="" onsubmit="return false">
    
    Initial value: <input type="text" value="1" id="Accum"><br>
    <button type="text" value="1" onClick="Add('Accum')">Add 1</button>
    <button type="text" value="1" onClick="Sub('Accum')">Sub 1</button>
    <button type="text" value="1" onClick="Mult('Accum')">Multiply 5</button>
    <button type="text" value="1" onClick="Div('Accum')">Divide 5</button>
    
    </form>
    </body>
    </html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles