在多个地方使用javascript更改CSS元素以获取相同的元素ID

时间:2013-03-25 12:10:19

标签: javascript html css html5

好的,所以我对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页面上多次出现。如果是这种情况,则仅元素的第一个实例是可见性被更改而不是其余部分。如果他们有相同的身份,为什么会这样?我怎样才能解决这个问题?这是一个链接,可以在我的网页上查看此操作,以使其更加清晰http://ec2-54-234-192-222.compute-1.amazonaws.com/home.php(有问题的按钮是明星) 任何帮助将不胜感激(如果有一个更清洁的方式刮我已经开放的东西,因为已经开始像意大利面!) 谢谢-brendan

1 个答案:

答案 0 :(得分:0)

因此,在上面的评论中,每个页面只出现一次ID!感谢@Jeff剃须刀澄清这个

,我责怪这是个新手