非表示スパン私は、自動ページリフレッシュにもかかわらず、それをクリックし

Question

HTML（quotazioni.php）

<?php 
    $azioni = $db_handle->runQuery("SELECT idAzione,nome,prezzo FROM azioni"); 
    foreach($azioni as $azione){ 
?>   

         <tr> 
          <td style="text-align:center;border-bottom:#F0F0F0 1px solid;"><a href="azione.php?idAzione=<?=$azione["idAzione"]?>"><?php echo $azione["nome"]; ?></a></td> 
          <td style="text-align:center;border-bottom:#F0F0F0 1px solid;"><?php echo $azione["prezzo"]; ?></td> 
          <td style="text-align:center;border-bottom:#F0F0F0 1px solid;"> 
           <a href="compraVendi.php?action=segui&idAzione=<?=$azione["idAzione"]?>" id="<?=$azione["nome"]?>" style="text-decoration:none;" class="preferiti" > 
            <span style="color:yellow;font-size:200%;" id="<?=$azione["idAzione"]?>" >&star;</span> 
           </a> 
          </td> 
         </tr> 
<?php 
    } 
?> 

PHP（compraVendi.php）

case "segui": 
      $db_handle->query("INSERT INTO preferiti (visibile,idAzione) VALUES (1,'".$_GET["idAzione"]."')"); 
      header("location: quotazioni.php"); 
      break; 

javascriptの

$(document).ready(function(){ 
    <?php 
     $preferiti = $db_handle->runQuery("SELECT * FROM preferiti"); 
     foreach($preferiti as $preferito){ 
      if ($preferito["visibile"]==1){ 
    ?>   
      var element = document.getElementById(<?=$preferito["idAzione"]?>); 
      element.hide(); 
    <?php 
      } 
     } 
    ?> 
}); 

Iリンクをクリックした後、リンク内のスパンを非表示にする必要があります。ページに自動リフレッシュが含まれていると考えて、スパンを無効にしておくにはどうすればよいですか？私は動作しないコードの例を提供し、問題を解決するために私を助けてください。 sqlデータベースでは、テーブルpreferitiにidPreferito、visibileおよびidAzioneが含まれています。好みの行をクリックすると、preferito行には1が格納されます。

Answer 1

ユーザーがスターをクリックすると、このデータを永続的なストレージ、つまりバックエンドに保存する必要があります。これは、ページの更新後にこの状態を取り戻す唯一の方法です。

ページをクライアントに提供するときに、あなたは文字列が含まれている例'disabled'のために、別のフィールドを検討しますが「無効」

それはこのようなものが考えられます。INSLINEを使用していない考えてみましょう

<a href="#" id="<?=$azione["nome"]?>" class="preferiti" > 
    <span class="favourites-star <?=$azione["disabled"]?>" id="<?=$azione["idAzione"]?>" >&star;</span> 
</a> 

スタイルを使用し、スタイリングにクラスを使用する - これは一般的な良い方法です。

.favourites-star { 
    color:yellow; 
    font-size:200%; 
} 

クラスはイベントを処理するときにも優れています。あなたは状態が保存されている間、心に留めておく必要がある

$(document).ready(function(){ 
    $('.prefereti').on('click', function(evt){ 
     // Save the state first and then disable the star - try it yourself! 
     $.post() 
      .done(function() { 
       $(evt.currentTarget).addClass('disable'); 
      }) 
      .fail(function() { 
       // Don't disable - instead show error 
      }); 
    }); 
}); 

もう一つは、あなたのページがリロードかもしれない - あなたはその時のために再ロードからそれを禁止するのが好きかもしれません。