有没有办法将这3个函数简化为1个函数?
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Vote!</title>
<script type="text/javascript">
var x1 = 0;
function countClicks() {
x1 += 1
document.getElementById( "counting" ).innerHTML = x1;
ClickCount++;
return true;
}
</script>
<script type="text/javascript">
var x2 = 0;
function countClicks1() {
x2 += 1
document.getElementById( "counting1" ).innerHTML = x2;
ClickCount++;
return true;
}
</script>
<script type="text/javascript">
var x3 = 0;
function countClicks2() {
x3 += 1
document.getElementById( "counting2" ).innerHTML = x3;
ClickCount++;
return true;
}
</script>
</head>
<body>
<div id="chart1">
<ul>
<li>
<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();" />
<div id="counting"></div>
</li>
<li>
<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();" />
<div id="counting1"></div>
</li>
<li>
<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 countClicks2();" />
<div id="counting2"></div>
</li>
</ul>
</div>
</body>
</html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Vote!</title>
<script type="text/javascript">
var x1 = 0;
function countClicks() {
x1 += 1
document.getElementById( "counting" ).innerHTML = x1;
ClickCount++;
return true;
}
</script>
<script type="text/javascript">
var x2 = 0;
function countClicks1() {
x2 += 1
document.getElementById( "counting1" ).innerHTML = x2;
ClickCount++;
return true;
}
</script>
<script type="text/javascript">
var x3 = 0;
function countClicks2() {
x3 += 1
document.getElementById( "counting2" ).innerHTML = x3;
ClickCount++;
return true;
}
</script>
</head>
<body>
<div id="chart1">
<ul>
<li>
<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();" />
<div id="counting"></div>
</li>
<li>
<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();" />
<div id="counting1"></div>
</li>
<li>
<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 countClicks2();" />
<div id="counting2"></div>
</li>
</ul>
</div>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
当然 。将您的 div id 作为参数传递给函数。请参阅 http://jsfiddle.net/KsePr/ 进行演示。
需要注意的是,如果您尝试在网页上实现某种投票系统,则需要在服务器端而不是客户端进行投票增量。
Of course . Pass your div id as an argument to the function . See http://jsfiddle.net/KsePr/ for a demo .
One word of caution - If you are trying to implement some kind of voting system on a webpage , you'll need to do the vote incrementing in at the server side , not the client side .
试试这个:
现在您可以使用任何您想要的元素 id 来调用它,例如:
请注意,这适用于任意数量的元素。
Try this:
Now you can call it with any element id you want, like:
Note that this will work with any number of elements.