質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Cookie

HTTPにおけるCookieとは、クライアントのウェブブラウザ上に保存された一時的なデータを指します。クライアント側のJavaScriptでも、サーバー側のHTTPヘッダーでもクッキーの読み書き・修正・削除が可能です。

jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

1266閲覧

JQUERYで配列の操作がうまくいかないです

marason

総合スコア12

Cookie

HTTPにおけるCookieとは、クライアントのウェブブラウザ上に保存された一時的なデータを指します。クライアント側のJavaScriptでも、サーバー側のHTTPヘッダーでもクッキーの読み書き・修正・削除が可能です。

jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2019/01/21 07:40

編集2019/01/21 20:03

###前提
JQUERYのcookie.jsでクッキーの保存をするときに、このようなボタンのdata-idを拾ってクッキーに保存していこうと考えてます。

ボタンはたくさんあり、クリックすると「.check」が「.uncheck」になります。

html

1<button type="button" data-id="1" class="check_btn uncheck">チェック済</button> 2<button type="button" data-id="2" class="check_btn check">チェック</button>

###実現したいこと
クリック済みである「.uncheck」をクリックしたときには、そのdata-idをクッキーから削除したいんですけど、そのときにカンマが残ってしまうので、これを削除したいです。

たとえば「4%2C2」のときに「4」の「.uncheck」をクリックしたときは「2」だけを保存したいのに、「%2C2」のような感じでカンマ(%2C)が残ったままクッキーに保存されてしまうんです。

###試したこと
↓現在のコードです

JQUERY

1$(function(){ 2 $(document).on("click",".check_btn.check", function(){ 3 $(this).removeClass('check').addClass('uncheck'); 4 var current_checkId = $.cookie("check"); 5 var click_checkId = $(this).attr('data-id'); 6 if (current_checkId) { 7 var result_checkId = click_checkId + ',' + current_checkId; 8 }else{ 9 var result_checkId = click_checkId; 10 } 11 $.cookie( "check", result_checkId,{ expires: 730, path:'/'} ); 12 }); 13 $(document).on("click",".check_btn.uncheck", function(){ 14 $(this).removeClass('uncheck').addClass('check'); 15 var current_checkId = $.cookie("check"); 16 var click_checkId = $(this).attr('data-id'); 17 if (current_checkId) { 18 var current_checkId_array = current_checkId.split(','); 19 var idx = current_checkId_array.indexOf(click_checkId); 20 if (idx != -1){ 21 current_checkId_array.splice(idx, 1); 22 } 23 var result_checkId = current_checkId.replace(click_checkId, ""); 24 }else{ 25 var result_checkId = click_checkId; 26 } 27 $.cookie( "check", result_checkId,{ expires: 730, path:'/'} ); 28 }); 29});

普通はどのように書くべきかなど、もっとちゃんとした書き方もあったら教えてほしいです。よろしくお願い致します!

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

専用の$.removeCookieというものが用意されています(README)。

なお、jQuery.cookieはjs-cookieに開発が移行している、とのことです。

投稿2019/01/21 07:43

maisumakun

総合スコア145121

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

marason

2019/01/21 07:45

それキーが全部削除されてしまいません?キーの中の特定の値を削除したいんです。
maisumakun

2019/01/21 07:51

最終的になくなればキーごと削除、という形でいいのではないでしょうか。
marason

2019/01/21 08:02 編集

あの、1と2をクリックしてクッキーにcheckというキーで2つの値あり、そこで2を外したとき、1はクッキーに保存しておきたいんですよね。でもそのときに1だけじゃなくてカンマが残るのが問題なんです。
maisumakun

2019/01/21 08:02 編集

カンマを消すのはcookie関数の扱うことではなく、単なる文字列処理です。
tacsheaven

2019/01/21 08:07

それはcookieを消すのではなくて、cookieの値の変更になりますから、そういうことしたければ自力で値を編集して再設定するしかないと思いますが。
marason

2019/01/21 19:00

仰る通りだと思います。
guest

0

ベストアンサー

cookieに保存した文字列を配列にして処理し、保存する時に文字列に戻せばよいです。

【【JavaScript入門】joinで配列を連結する方法(改行/置換) | 侍エンジニア塾ブログ | プログラミング入門者向け学習情報サイト】
https://www.sejuku.net/blog/23137

【JavaScript - indexOf() を使って配列の要素を削除する | ITライフ】
https://infoteck-life.com/a0094-js-array-delete-indexof/

【String.prototype.split() | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/split

【Array.prototype.join() | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/join

投稿2019/01/21 16:15

kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

marason

2019/01/21 19:00 編集

あぁ、こういう方向性のご回答が欲しかったんです。ありがとうございます。配列を使った方式のコードですが、質問のコードをそういう流れに直したのですが、これだとどこがいけませんか?もしよかったら教えてください。
kei344

2019/01/22 02:02

current_checkId_arrayがクッキーに入っていません。 回答が付いた質問の編集は慎重に行ってください。質問文のコードについて回答にて指摘があった場合は「追記」し、元のコードを編集する場合も「直したこと」がわかるようにしてください。
marason

2019/01/22 05:51

どうもありがとうございます。なるほど、失礼致しました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問