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 clickL开发者_开发百科imit = 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>
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
精彩评论