jQuery - Increase the value of a counter when a button is clicked
- by Taimur
Hi,
I'm making a system where a user clicks a button and their score increases. There is a counter which I would like to increase the value of using jQuery (so that the page does not need to refresh) when the button is clicked.
How would I go about this?
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
$("#update").click(function() {
$("#counter")++;
}
</script>
#update is the button, #counter is the counter.
In php, ++ increases something's value. What's the jQuery equivalent?
Also, when the button is clicked, it needs to send a request which updates the score value in a mysql database as well, without the page refreshing. Does anyone know how I would do that?
Thanks a lot
UPDATE:
I've tried a few of the methods below, but nothing seems to work! Do I need to change anything else for it to work? I've created a test page for it:
<html>
<body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
var count = 0;
$("#update").click(function() {
count++;
$("#counter").html("My current count is: "+count);
}
</script>
<button id="update" type="button">Button</button>
<div id="counter">1</div>
</body>
</htlm>