jQuery的 - 增加计数器的值是单击按钮时 [英] jQuery - Increase the value of a counter when a button is clicked
问题描述
我在做其中一个用户点击一个按钮，他们的分数增加的系统。还有，我想，以增加使用jQuery（这样页面不需要刷新）按钮被点击时的值的计数器。
我会如何呢？
＆LT;脚本类型=文/ JavaScript的SRC =HTTP：//$c$c.jquery.com/jquery-1.4.3.min.js＆GT; ＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;$（＃更新）。点击（函数（）{
$（＃柜台）++;
}＆LT; / SCRIPT＆GT;
#UPDATE是按钮，#counter是计数器。
在PHP中，增加++的东西的价值。什么是jQuery的等价？
此外，点击该按钮时，它需要发送的更新在MySQL数据库中的分值为好，没有页面清爽的请求。有谁知道我会怎么做呢？
非常感谢
更新：
我试过几个下面的方法，但似乎没有任何工作！我需要改变任何东西为它工作？我创建了一个测试页面吧：
＆LT; HTML和GT;
＆LT;身体GT;
＆LT;脚本类型=文/ JavaScript的SRC =HTTP：//$c$c.jquery.com/jquery-1.4.3.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;变种数= 0;$（＃更新）。点击（函数（）{
算上++;
$（＃柜台）HTML（我的当前计数：+计数）;
}＆LT; / SCRIPT＆GT;
＆LT;按钮ID =更新类型=按钮＆GT;按钮和LT; /按钮＆GT;
＆LT; DIV ID =计数器＆GT; 1 LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTLM＆GT;
您不能使用 ++ 的东西不是一个变量，这将是最接近你可以得到：
$（'＃柜台'）HTML（功能（我，VAL）{返回+ VAL + 1}）;
jQuery的 HTML（） 方法可以获取和设置HTML元素的值。如果传递一个函数就可以更新基于现有价值的HTML。因此，在您code的范围内：
$（＃更新）。点击（函数（）{
$（'＃柜台'）HTML（功能（我，VAL）{返回+ VAL + 1}）;
}
DEMO： http://jsfiddle.net/marcuswhybrow/zRX2D/2/
当涉及到同步您的网页上柜台，在你的数据库中的计数器值，永远不要相信客户端！您发送要么是递增或递减信号，你的服务器端脚本，而不是连续值，例如10或23。
然而，当你改变计数器的HTML，你可以发送一个AJAX请求到服务器：
$（＃更新）。点击（函数（）{
$（'＃柜台'）。HTML（功能（我，VAL）{
$阿贾克斯（{
网址：'/路径/到/脚本/'，
输入：POST，
数据：{增量：真正}，
成功：函数（）{警报（请求返回'）}
}）;
回报+ VAL + 1;
}）;
}
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>
You cannot use ++ on something which is not a variable, this would be the closest you can get:
$('#counter').html(function(i, val) { return +val+1 });
jQuery's html() method can get and set the HTML value of an element. If passed a function it can update the HTML based upon the existing value. So in the context of your code:
$("#update").click(function() {
$('#counter').html(function(i, val) { return +val+1 });
}
DEMO: http://jsfiddle.net/marcuswhybrow/zRX2D/2/
When it comes to synchronising your counter on the page, with the counter value in your database, never trust the client! You send either an increment or decrement signal to you server side script, rather than a continuous value such as 10, or 23.
However you could send an AJAX request to the server when you change the HTML of your counter:
$("#update").click(function() {
$('#counter').html(function(i, val) {
$.ajax({
url: '/path/to/script/',
type: 'POST',
data: {increment: true},
success: function() { alert('Request has returned') }
});
return +val+1;
});
}
这篇关于jQuery的 - 增加计数器的值是单击按钮时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
