回答編集履歴

1

追記

2017/09/19 07:16

投稿

m.ts10806
m.ts10806

スコア80850

test CHANGED
@@ -3,3 +3,137 @@
3
3
  有効期限があるCOOKIEやSESSIONではなくブラウザ側に保管する[LocalStorage](http://www.htmq.com/webstorage/)を利用されては?
4
4
 
5
5
  javascriptなどで明示的に削除するかユーザー自身がブラウザの開発ツールで削除(かブラウザ自体をアンインストール)するまでは永続的です。
6
+
7
+
8
+
9
+ # サンプルソース
10
+
11
+
12
+
13
+ Cookie読む部分とHTML(<?php冒頭と途中のHTML省略)
14
+
15
+ ```php
16
+
17
+ $favorite = [];
18
+
19
+ if(array_key_exists("favorite",$_COOKIE)){
20
+
21
+ $favorite = explode("/",$_COOKIE["favorite"]);
22
+
23
+ }
24
+
25
+
26
+
27
+ $add_disp = "";
28
+
29
+ $remove_disp = "";
30
+
31
+ $none = ' style="display:none;"';
32
+
33
+ if(!in_array(1, $favorite)){
34
+
35
+ $remove_disp = $none;
36
+
37
+ }else{
38
+
39
+ $add_disp = $none;
40
+
41
+ }
42
+
43
+ ?>
44
+
45
+ <div class="favorite_btn">
46
+
47
+ <a onClick="add_fav(1); return false;" id="add_fav"<?=$add_disp?>>お気に入りに追加</a>
48
+
49
+ <a onClick="remove_fav(1); return false;" id="remove_fav"<?=$remove_disp?>>お気に入り</a>
50
+
51
+ </div>
52
+
53
+ ```
54
+
55
+
56
+
57
+ ajaxに送る部分
58
+
59
+ ```javascript
60
+
61
+ function add_fav(id){
62
+
63
+ $.ajax({
64
+
65
+ type: "POST",
66
+
67
+ url: "add_fav.php",
68
+
69
+ data: {
70
+
71
+ "id" : id
72
+
73
+ },
74
+
75
+ success: function(data){
76
+
77
+ $("#remove_fav").show();
78
+
79
+ $("#add_fav").hide();
80
+
81
+ alert("お気に入りに追加しました");
82
+
83
+ }
84
+
85
+ });
86
+
87
+ }
88
+
89
+ function remove_fav(id){
90
+
91
+ $.ajax({
92
+
93
+ type: "POST",
94
+
95
+ url: "remove_fav.php",
96
+
97
+ data: {
98
+
99
+ "id" : id
100
+
101
+ },
102
+
103
+ success: function(data){
104
+
105
+ $("#remove_fav").hide();
106
+
107
+ $("#add_fav").show();
108
+
109
+ alert("お気に入り削除");
110
+
111
+ }
112
+
113
+ });
114
+
115
+ }
116
+
117
+
118
+
119
+ ```
120
+
121
+
122
+
123
+ cssのadd_favクラスが何を指定しているか分かりませんが、
124
+
125
+ もしshow,hideしていたり何かしらボタン装飾しているようであれば、click時のイベントでclassの付け外しするのではなく、
126
+
127
+ ajaxのsuccessを以てclassの付け外しすべきと思います。
128
+
129
+ 万が一、ajaxが失敗した際に、「追加しました」「削除しました」の文言がalertされないのに
130
+
131
+ 装飾が変わっているということがあるのではと思います。
132
+
133
+
134
+
135
+ と、いうか、ご提示の組み方だとどちらかしかHTMLに出てないので、画面をリロードしない限りは
136
+
137
+ リンクの見た目は変わってても、ajaxが片方しか呼び出されないようになっていると思いますよ。
138
+
139
+ つまり、COOKIEに保存前だと常に「お気に入りへの追加」だけが起こっている状況ですね。