0

さて、いくつかのチュートリアルとこのサイトを通して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を持っている場合、これはなぜですか？どうすればこれを修正できますか？これをより明確にするために、私のWebページでこれが実際に動作していることを確認するためのリンクがありますhttp://ec2-54-234-192-222.compute-1.amazonaws.com/home.php（問題のボタンは星）どんな助けでも大歓迎です（私がすでにスパゲッティに似始めているので私が開いているものをこするよりきれいな方法があれば！）ありがとう-brendan

4

1 に答える 1

0

したがって、上記のコメントのように、IDはページごとに1回だけ表示されます。これを明確にしてくれた@Jeffシェーバーのおかげで、私はこれを初心者であると非難しています

于 2013-03-25T12:16:51.557 に答える