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

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

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

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

Q&A

4回答

2783閲覧

JSのテキスト保存について

Yoshinori

総合スコア35

JavaScript

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

0グッド

0クリップ

投稿2015/08/03 10:09

下記のコードはテキストボックスに書かれた文字をinnerHTMLで書き出しそれを更新しても消えない、保存するというプログラムです。
ですが肝心の保存ができません
なぜでしょうか?

JavaScript

1<!doctype html> 2<html> 3<head> 4 <meta charset="utf-8"> 5</head> 6 7<body> 8 <!--テキストエリアでタイトル決め--> 9 10 <input type="text" value="" id="title"> 11 <input type="button" id="reside" value="決定" onclick="deside()"> 12 <div id="main"> 13 </div> 14 15 <script> 16 function deside(){ 17 var title = document.getElementById('title').value; 18 var a = document.getElementById('main').innerHTML = title; 19 window.onload = function() { 20 var title_1 = localStorage.getItem(a); 21 if (title_1 != null) title.value = title_1; 22 } 23 title.onchange = function() { 24 localStorage.setItem(a,title.value); 25 } 26 27} 28 </script> 29</body> 30 31</html>

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

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

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

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

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

guest

回答4

0

なぜそうなってるのか理解できない点が複数ありますが、初心者でわけもわからず書いているからなのでしょうか。そうであることを前提に、おそらくこういうことがしたいのだろうと思われるコードを書きました。

<!doctype html> <html> <head> <meta charset="utf-8"> </head> <body> <input type="text" value="" id="title"> <input type="button" id="reside" value="決定" onclick="deside()"> <div id="main"></div> <script> function deside() { var title = document.getElementById('title').value; document.getElementById('main').innerHTML = title; } window.onload = function() { var title_1 = localStorage.getItem("title"); if (title_1 != null) title.value = title_1; document.getElementById('title').onchange = function() { localStorage.setItem("title", document.getElementById('title').value); } } </script> </body> </html>

投稿2015/08/03 17:36

miu_ras

総合スコア902

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

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

Cf_cwd

2015/08/04 01:13

window.onload = function (){} 内のtitle.value = title_1;はfunction deside(){}の中の変数を使おうとしたものですか? (変数titleはローカルで宣言されているため、グローバルでは宣言されていない)
miu_ras

2015/08/04 04:33

> function deside(){}の中の変数を使おうとしたものですか? あぁ確かにそうですね…。 別にそういう意図は無く、動くように直していく過程でそれで動いたので気づかなかったということです。 明示的にこう書くほうがいいですね。ご指摘ありがとうございます if (title_1 != null) document.getElementById('title').value = title_1; そこを直すとこうなります。 <script> function deside() { var title = document.getElementById('title').value; document.getElementById('main').innerHTML = title; } window.onload = function() { var title_1 = localStorage.getItem("title"); if (title_1 != null) document.getElementById('title').value = title_1; document.getElementById('title').onchange = function() { localStorage.setItem("title", document.getElementById('title').value); } } </script>
guest

0

javascript

1<script> 2var key = "title" 3function deside(){ 4var title = document.getElementById('title').value; 5 document.getElementById('main').innerHTML = title; 6 localStorage.setItem(key, title); 7} 8var title_1 = localStorage.getItem(key); 9if ( title_1 != null ) { 10 document.getElementById('main').innerHTML = title_1; 11} 12 </script>

setItem は key と value のセットで保存 連想配列みたいな
deside()クリックで値を取り、main へ書き出す。
localStorageへ key と 値を保存

ページを更新した時に自動的に title_1....が実行されるのでnull じゃないなら
mainへ書き出す

投稿2015/08/03 15:35

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

0

いろいろおかしいように見受けられます。

var a = document.getElementById('main').innerHTML = title;
ですが、aにtilteを入れたいのでしょうか?

window.onload = function() {
var title_1 = localStorage.getItem(a);
if (title_1 != null) title.value = title_1;
}
でtitle.value = title_1;としていますが、
var title = document.getElementById('title').value;で
valueを取ってきているのでtitle.valueには入れられないかと。
titleで処理している所はすべて正常に動いていない事はないですか?

投稿2015/08/03 10:58

chiku_

総合スコア1464

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

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

0

うーんそれは「一度入れたタイトルが、画面を更新しても消えない」という動きをしたいということでしょうか。
そうなるとonloadした時点で入力情報は失われますので、cookieにでも保存するしかないかと…。

投稿2015/08/03 10:41

yu-ri

総合スコア634

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

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

think49

2015/08/05 02:29

質問者は localStorage に保存しようとしているのでは…。
yu-ri

2015/08/05 04:10

ああそういうことでしたか。localSrorage使ったことなかったので失礼しました。 jQueyでサクッとできましたが、なんかjQuery使ってはいけない雰囲気なので他の方のご回答を参考にしてください(逃
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問