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

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

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

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

jQuery

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

Q&A

解決済

1回答

1479閲覧

一年間のカレンダー表示

退会済みユーザー

退会済みユーザー

総合スコア0

JavaScript

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

jQuery

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

0グッド

1クリップ

投稿2019/08/21 00:39

編集2019/08/23 02:49
コードhtml <input name="textYear"> 年 <select name="selectMonth"></select> 月
コード$(function(){ $('input[name="textYear"]').on('change keyup',function(){ $('select[name="selectMonth"] option').remove(); $('select[name="selectMonth"]').append($("<option></option>")); if($(this).val() != ""){ for(i=4;i<=15;i++){ let m = (i<13)?i:(i-12); m =('0' + m).slice(-length); let y = (i<13)?$(this).val():parseInt($(this).val())+1; let op =$("<option></option>",{           value:y+m,           html:y+"年"+m+"月"          }); $('select[name="selectMonth"]').append(op); } } }); });

に変更しましたが、1月2月3月の年数がNaNと表示になりました。

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

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

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

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

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

m.ts10806

2019/08/21 00:43

コードはマークダウンのcode機能を利用してご提示ください
m.ts10806

2019/08/21 01:04

しかし、Thymeleafはどう関係するのでしょうか。 質問内容からして関係のなさそうなタグをつけすぎていると思います。
退会済みユーザー

退会済みユーザー

2019/08/23 00:37 編集

1
退会済みユーザー

退会済みユーザー

2019/08/23 00:39 編集

1
m.ts10806

2019/08/22 07:55

回答の方にコメント付けてください。
guest

回答1

0

ベストアンサー

動かなく

関数呼び出しは()をつけます。

html

1<select name="selectYear" onchange="setselectMonth"></select>年度 23<select name="selectYear" onchange="setselectMonth()"></select>年度

下記はHTMLがおかしいですね。

html

1<select name="select="selectMonth"></select>23<select name="selectMonth"></select>

Nowという変数は宣言されていないのでエラーが出ると思います。

js

1var NowMonth=Now.getMonth()+1; 2console.log('value = ' + value + '= ' + NowMonth);

テキストボックスにブラウザ上で例えば2019年度と入力されているときという要件なので別のテキストボックスから取得してくるということでしょうか?
そのHTMLも提示いただいた方が良さそうですね。
→理解しました。これは「テキストボックス」ではなく「セレクトボックス」ですね。

selectYearセレクトボックス選択→selectMonthセレクトボックス変更

としたらselectYearセレクトボックスの内容も作る必要があります。
どういう幅(何年~何年)で作る要件でしょうか?


簡単にやるならこう。
日付けの型のチェックも何もしてません。

html

1 <input name="textYear">2 <select name="selectMonth"></select>

js

1$(function(){ 2 $('input[name="textYear"]').on('change keyup',function(){ 3 $('select[name="selectMonth"] option').remove(); 4 $('select[name="selectMonth"]').append($("<option></option>")); 5 if($(this).val() != ""){ 6 for(i=4;i<=15;i++){ 7 let m = (i<13)?i:(i-12); 8 m =('0' + m).slice(-length); 9 10 let op =$("<option></option>",{ 11 value:$(this).val()+m, 12 html:$(this).val()+"年"+m+"月" 13 14 }); 15 $('select[name="selectMonth"]').append(op); 16 } 17 } 18 }); 19});

できれば日付系の機能を使って加算したほうが日付形式のチェックもできるので望ましいですが、自分で考えてみてください。
あくまで私の回答のコードは「とりあえず動くからOK」というだけの悪手です。

投稿2019/08/21 00:45

編集2019/08/22 04:56
m.ts10806

総合スコア80765

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

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

退会済みユーザー

退会済みユーザー

2019/08/21 01:49 編集

ブラウザでユーザーがテキストボックスに年数を入力して、その値と同じ値の一年分を表示させたいです。 なので幅でセレクトボックスから選ぶのではなく、テキストボックスで入力された年数4月始まりの翌年3月までの値をセレクトボックスに表示させたいです。  ボックスは2つあり、一つはテキストボックスで、その隣にプルダウンメニューがある使用にしたいです。 なので、 selectタグではなく、inputタグを使うのがただしかったかもです。すいません。
m.ts10806

2019/08/21 01:51

質問を編集して追記(あとコードのマークダウン対応)をお願いできますか? >selectタグではなく、inputタグを使うのがただしかったかもです。すいません。 いえ、これは何でも良いと思います。ただ質問者さんが「テキストボックス」と仰っていて「セレクトボックス」が設置されていたので「どっちかな」と思っただけです。 むしろinputだと自由入力できるので文字列制御が面倒かもしれません。 そこを除くと単純に実装するならセレクトボックスのほうが楽です。
退会済みユーザー

退会済みユーザー

2019/08/21 01:54

セレクトは幅が広くなってしまうので、入力で作成したいです。
m.ts10806

2019/08/21 01:55

事情は良く分からないですが、諸々含めて質問本文を編集・追記してください。 要件なので、コメントに書かれるより質問本文にあったほうが良いです。
m.ts10806

2019/08/22 07:59

>ありがとうございます。もし1月2月3月なら年を1プラスするという条件式をくわえたいのですが、うまくいかないです。プラスする条件式はどのように変えたらいいでしょうか? 下記使ってください。 let m = (i<13)?i:(i-12); 月を求める式ですが「13未満ならiそのまま、12を超えたら12」なので 「13未満なら$(this).val()そのまま、12を超えたら$(this).val()+1」を別途処理追加する。 ただ、こういった計算処理が必要なので回答の後半に書いた「日付系の機能を使って加算」が望ましいです。
退会済みユーザー

退会済みユーザー

2019/08/23 02:26 編集

$(function(){ $('input[name="textYear"]').on('change keyup',function(){ $('select[name="selectMonth"] option').remove(); $('select[name="selectMonth"]').append($("<option></option>")); if($(this).val() != ""){ for(i=4;i<=15;i++){ let m = (i<13)?i:(i-12); m =('0' + m).slice(-length); let m = (i<13)?i:(i-12); html:$(this).val()+1+"年"+m+"月" let op =$("<option></option>",{ value:$(this).val()+m, html:$(this).val()+"年"+m+"月" }); $('select[name="selectMonth"]').append(op); } } }); });
m.ts10806

2019/08/23 02:15 編集

コメントが削除されてしまったのでそのコードが何を示すものか分かりません。 構文エラーが出ていることは分かりますけど。
退会済みユーザー

退会済みユーザー

2019/08/23 02:27

「13未満なら$(this).val()そのまま、12を超えたら$(this).val()+1」を別途処理追加する。 いろいろためしてみたのですが、うまく動かないです。let m = (i<13)?i:(i-12); html:$(this).val()+1+"年"+m+"月"を追加しましたが動かないです。 教えて頂きたいです。
m.ts10806

2019/08/23 02:31 編集

let y = (i<13)?$(this).val():parseInt($(this).val())+1; let op =$("<option></option>",{ value:y+m, html:y+"年"+m+"月" }); というかやはりかなりごり押しの悪手にしかならないので、 日付系の機能を使って加算 のほうを採用してもらいたいです。
退会済みユーザー

退会済みユーザー

2019/08/23 02:38 編集

m.ts10806

2019/08/23 02:39

ん。と全く動かないコードを提示されても。
m.ts10806

2019/08/23 02:40

編集削除する場合はなるべく「なぜ削除したか」または「削除したことが分かるように」編集コメントしてもらったほうが良いです。1とかだけだと荒らしに見えてしまいます。
退会済みユーザー

退会済みユーザー

2019/08/23 02:40

ありがとうございます。試してみましたが、数字がかさんされず、NaN年01月と表示されました。
m.ts10806

2019/08/23 02:42

どういうコードになったか書いてもらわないとこちらの意図通りのものか分かりません(回答にここまで書いた以上はロジックを理解できればご自身で解決できると思っています) まずはコードを1つ1つひも解いて意味を理解してください。
m.ts10806

2019/08/23 02:42

>どういうコードになったか書いてもらわないと もちろんコメントに記載するのではなく、質問本文更新してマークダウンで提示してくださいね。
m.ts10806

2019/08/23 02:55

ん?提示されたコードできちんと動きますけど。 全角数値打ったのでは?そこまでの考慮はしていません。要件にありませんし。バリデーション必要であればそこは自身で入れてみてください。 (だから再三「日付系の機能を使って加算を採用してください」と言っています)
退会済みユーザー

退会済みユーザー

2019/08/23 03:00

すいません。動きました。了解です、日付系の機能を使って加算を採用も試してみます。有難うございました。
m.ts10806

2019/08/23 03:39

はい。日付関連の関数を利用すればそれがまたバリデーションにもなります。
退会済みユーザー

退会済みユーザー

2019/08/23 05:07

了解しました!
m.ts10806

2019/08/23 05:08

ちなみに「バリデーションって何」というところは理解した上でのご返答ですよね?
退会済みユーザー

退会済みユーザー

2019/08/23 06:33

はい。
m.ts10806

2019/08/23 06:34

了解です。それなら良かった。
退会済みユーザー

退会済みユーザー

2019/08/23 08:42

ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問