データベースからクリックまたは照会すると、アイコンが完全なハートを表示し、情報が次のようにデータベースに保存されるというリンクがあります。
<a id="fav" href="#"><i <?if($fe == 1){?>class="faved"<?}else{?>class="fav"<?}?>></i></a>
$("#fav i.fav").click(function(){
fav= new XMLHttpRequest();
fav.open("GET", "http://test.php?u=<?=$user_id?>", true);
fav.send();
$("#fav i").removeClass('fav').addClass('faved');
});
$("#fav i.faved").click(function(){
fav= new XMLHttpRequest();
fav.open("GET", "http://test.php?u=<?=$user_id?>", true);
fav.send();
$("#fav i").removeClass('faved').addClass('fav');
});
現在は問題なく機能していますが、ユーザーがページのお気に入りを削除することを決定した場合、現在の状態に応じて別のレコードを保存するか、再度削除しようとするという問題があります。状態に応じて切り替えるにはどうすればよいですか。たとえば、お気に入りに追加されていない場合、クリックするとデータベースに保存され、更新せずにもう一度クリックすると、データベースから削除されます。
アップデート
リンクには、レコードを削除または保存するように php に指示するアクションもあります。例: http://test.php?u=<?=$user_id?>a=1
(保存) http://test.php?u=<?=$user_id?>a=2
(削除)
答え
@epascarelloの回答に基づいています。
$("#fav").on("click", "i.fav", function(){
var icon = $(this);
var makeFavorite = icon.hasClass("fav");
$.post("http://test.php&u=<?=$user_id?>&a=1",{isFav:makeFavorite}, function(){
icon.toggleClass("fav").toggleClass("faved");
});
});
$("#fav").on("click", "i.faved", function(){
var icon = $(this);
var delFavorite = icon.hasClass("faved");
$.post("http://test.php&u=<?=$user_id?>&a=2",{isFav:delFavorite}, function(){
icon.toggleClass("faved").toggleClass("fav");
});
});