好吧,通过一些教程和这个网站,我对 html/javascript/css 还很陌生。我正在尝试显示一个按钮,单击该按钮时我使用 css 覆盖图像我调用 javascript 函数将一些信息发送到我的服务器以及用新按钮和图像覆盖替换单击的按钮。这是负责这个的代码片段(我基本上只是来回切换按钮的可见性):
<style type = 'text/css'>
input.btn_follow {
position: absolute;
right: 2px;
top: 2px;
background-image: url(http://icons.iconarchive.com/icons/icojam/onebit/48/star-100-icon.png); /* 16px x 16px */
}
input.btn_unfollow {
visibility: hidden;
position: absolute;
right: 2px;
top: 2px;
background-image: url(http://gologic.com/imagesOld/checkmark%20-%20small.png);
}
</style>
</head><body>
<script type='text/javascript'>
function follow(series, status) {
var xhReq = new XMLHttpRequest();
var request = "follow.php?series="+series+"&status="+status
xhReq.open("GET", request, false);
xhReq.send(null);
var response = xhReq.responseText;
var IDyes = "follow_"+series
var IDno = "unfollow_"+series
if (response == 1){
document.getElementById(IDyes).style.visibility='hidden'
document.getElementById(IDno).style.visibility='visible'
}
else if (response == 0){
document.getElementById(IDyes).style.visibility='visible'
document.getElementById(IDno).style.visibility='hidden'
}
else if (response == -1){
alert("you must first login to use the follow request"); // now following show
}
}
</script>
所有这些都有效,但是对于某些元素 ID,它们会在同一 html 页面上出现多次。如果是这种情况,只有元素的第一个实例的可见性会发生变化,其余的则不会。如果他们有相同的 ID,为什么会这样?我怎样才能解决这个问题?这是一个链接,可以在我的网页上查看此操作,以使其更清楚 http://ec2-54-234-192-222.compute-1.amazonaws.com/home.php (有问题的按钮是星星) 任何帮助将不胜感激(如果有一种更清洁的方法来刮掉我所拥有的东西,我已经开始像意大利面条一样开放了!) 谢谢-布伦丹
最佳答案
所以在上面的评论中,ID 应该每页只出现一次!感谢@Jeff shaver 澄清了这一点,我将此归咎于新手
关于javascript - 在多个地方使用 javascript 为相同的元素 id 更改 CSS 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15614592/