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

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

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

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

1844閲覧

javascriptで取得したcookieを次のページのinput内に反映させたい

yukina00235

総合スコア62

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2020/06/22 04:11

javascriptでフォームのemailに入力されたメールアドレスをcookieで保存しました。

このアドレスを遷移後のフォームのメールアドレス欄にセットしたいのですが、基本的にセット済みのcookieデータはどのように取り出せばよいでしょうか?

また、console.log(document.cookie);  といった感じで確認を行いますと今回設定したものとは関係のないcookieが沢山表示されてしまいます。

取得表示を行いたいのは、emailcookie の cookieValue、つまりアドレス部分を取得しinputに設定を行いたいです。

ご教授のほどよろしくお願いいたします。

javascript

1 <script type="text/javascript"> 2 var email = document.getElementById("email"); 3 function writeCookie() { 4 var cookieValue = email.value; 5 document.cookie = "emailcookie=" + cookieValue; 6 } 7 </script>

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

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

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

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

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

guest

回答3

0

cookieよりlocalStorageのほうが直感的な取出しができると思います。

【Web Storage API の使用 - Web API | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

【ブラウザにデータを保存するlocalStorage(ローカルストレージ)の使い方 | 株式会社グランフェアズ】
https://www.granfairs.com/blog/staff/local-storage-01

投稿2020/06/22 04:16

kei344

総合スコア69364

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

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

yukina00235

2020/06/22 05:32

有難うございます、初心者物で…、初めてlocalStorageなるものを聞きました。 こちらも調べてみたいと思います。
guest

0

基本的にセット済みのcookieデータはどのように取り出せばよいでしょうか?

document.cookieから目的のものを切り出してください。

また、console.log(document.cookie);  といった感じで確認を行いますと今回設定したものとは関係のないcookieが沢山表示されてしまいます。

そういう仕様なので、この中から探してピックアップするしかありません。

投稿2020/06/22 04:13

maisumakun

総合スコア145121

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

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

yukina00235

2020/06/22 05:31

有難うございます、そうなのですね配列で返ってきたので。。 切り出して取り出すように致します。
guest

0

ベストアンサー

面倒であればjQuery+クッキーライブラリで処理すればよいでしょう

投稿2020/06/22 04:59

yambejp

総合スコア114581

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

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

yambejp

2020/06/22 05:00

//home.html <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script> <script> $(function(){ $('#s').on('change',function(){ $.cookie('x',$(this).val()); }).trigger('change'); }); </script> <select id="s"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <a href="next.html">next</a> //next.html <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script> <script> $(function(){ $('#x').val($.cookie('x')); }); </script> <input type="text" id="x" name="x">
yukina00235

2020/06/22 05:34

有難うございます、調べてみますとjQueryからですと簡単に色々と行えるようですね。 具体的なソースも有難うございます。mm
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問