自排序投票系统
我需要一些基于 javascript 的代码来帮助我的投票系统。基本上，我正在努力弄清楚如何让我的收到投票的项目自行进入订单状态。因此，如果一个项目有 52 票，而下面的项目获得 2 票，达到 54 票，我希望它与上面的 1 票交换位置。
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Vote!</title>
<style>
#counting {
font-family:avante;
font-size:20px;
border:0px;
}
#counting1 {
font-family:avante;
font-size:20px;
border:0px;
}
</style>
<script type="text/javascript">
function countClicks() {
var x = 0;
x += 1
document.getElementById( "counting" ).value = x;
var clickLimit = 1; //Max number of clicks
if(x>=clickLimit) {
}
else
{
ClickCount++;
return true;
}
}
</script>
<script type="text/javascript">
function countClicks1() {
var x = 0;
x += 1
document.getElementById( "counting1" ).value = x;
var clickLimit = 1; //Max number of clicks
if(x>=clickLimit) {
}
else
{
ClickCount++;
return true;
}
}
</script>
</head>
<body>
<img src="../Pictures/BWS + L.A +KUSH/Game.RED_Album_Cover.jpg" alt="red album"><br>
<input type="button" value="VOTE" name="clickOnce" onclick="return countClicks();" /> <br>
<input id="counting" type="text">
<br>
<br>
<img src="../Pictures/BWS + L.A +KUSH/Game.RED_Album_Cover.jpg" alt="red album"><br>
<input type="button" value="VOTE" name="clickOnce" onclick="return countClicks1();" /> <br>
<input id="counting1" type="text">
</body>
</html>
I need some javascript based code that can help my voting system. Basically I am struggling to work out how to get my items that receive votes to move into order by itself LIVE. So If an item had 52 votes and the item below gained 2 votes to make 54 I would like it to swap places with the 1 above.
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Vote!</title>
<style>
#counting {
font-family:avante;
font-size:20px;
border:0px;
}
#counting1 {
font-family:avante;
font-size:20px;
border:0px;
}
</style>
<script type="text/javascript">
function countClicks() {
var x = 0;
x += 1
document.getElementById( "counting" ).value = x;
var clickLimit = 1; //Max number of clicks
if(x>=clickLimit) {
}
else
{
ClickCount++;
return true;
}
}
</script>
<script type="text/javascript">
function countClicks1() {
var x = 0;
x += 1
document.getElementById( "counting1" ).value = x;
var clickLimit = 1; //Max number of clicks
if(x>=clickLimit) {
}
else
{
ClickCount++;
return true;
}
}
</script>
</head>
<body>
<img src="../Pictures/BWS + L.A +KUSH/Game.RED_Album_Cover.jpg" alt="red album"><br>
<input type="button" value="VOTE" name="clickOnce" onclick="return countClicks();" /> <br>
<input id="counting" type="text">
<br>
<br>
<img src="../Pictures/BWS + L.A +KUSH/Game.RED_Album_Cover.jpg" alt="red album"><br>
<input type="button" value="VOTE" name="clickOnce" onclick="return countClicks1();" /> <br>
<input id="counting1" type="text">
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
由于投票（大概）存储在服务器上，因此您需要定期请求更新的数据（例如使用 XHR ）。显然，这需要您有一个服务器端程序来生成数据（JSON 是数据格式的不错选择） 。获得数据后，您可以使用它来决定 HTML 元素应显示的顺序，并使用 移动它们insertBefore 和 appendChild
Since the votes are (presumably) stored on the server, you will need to request updated data periodically (e.g. using XHR). Obviously, this will require that you have a server side program to generate the data (JSON is a good choice for the data format). Once you have the data, you can use it to decide what order your HTML elements should appear in and move them around with insertBefore and appendChild