Simple Coding Project: Button with Global Counter

**rockethunder** · 01-15-2011 11:35 PM

Hey there

I'm learning the basics of HTML, CSS, and Javascript and I have an easy project to anyone who would oblige.

I need a button (nothing fancy, just a regular button) that displays the global number of times it has been clicked. Sadly, these concepts are still beyond me at this point and though I can make a button, and make a counter, I need to link the two. Creds to whoever helps out.

Thanks

Rockethunder

**coothead** · 01-16-2011 06:47 AM

Hi there rockethunder,

does this help...

Code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<title>my little button</title>

<style type="text/css">
#mybutton {
    display:block;
    width:4em;
    margin:auto;
    cursor:pointer;
 }
</style>

<script type="text/javascript">
function init(){
   var c=1;
document.getElementById('mybutton').onclick=function() {
   this.value=c++;
  }
 }
 window.addEventListener?
 window.addEventListener('load',init,false):
 window.attachEvent('onload',init);
</script>

</head>
<body>

<div>
 <input id="mybutton" type="button" value="0">
</div>

</body>
</html>

coothead

**donatello** · 01-16-2011 07:59 AM

Funny.
I started a project to make a button generator once and thought of putting up this script too, but this project has been left half done... got bored with it.

If you like, you can use the button generator script.
button generator

**rockethunder** · 01-16-2011 09:20 AM

Thanks coothead!

The button works great but I'm looking to add a tad more funtionality:

Could the button somehow recall how many times it's been pressed?

For instance, I press the button ten times and come back later to find that someone else has pressed the button nine times and instead of the button reading "0" it reads "19".

Thanks!

**coothead** · 01-17-2011 06:39 AM

Hi there rockethunder,

to "add a tad more funtionalit" would require server-side php or similar.

Does your server provide this facility?

coothead

**rockethunder** · 01-17-2011 11:04 PM

My server is hosted from under my desk at home. I have SSH, SFTP, and physical access to it. I'm pretty sure I have LAMP installed as well. It's a relatively low-traffic site if that matters at all...

Thanks
Ezra

**coothead** · 01-18-2011 04:25 AM

Hi there rockethunder,

check out the attachment, for a PHP version of your button.

coothead

Thread: Simple Coding Project: Button with Global Counter

Thread Tools

Display

Simple Coding Project: Button with Global Counter

Why yes indeed...

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions