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

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

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

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

729閲覧

jQueryのコードが反応しない

fukuboh

総合スコア6

jQuery

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

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2020/02/01 07:58

編集2020/02/01 10:25

前提・実現したいこと

jQueryを使用して画面の入力項目にフォーカスが当たったら背景色を変更しようとしています。

発生している問題・エラーメッセージ

登録画面と更新画面の2画面で実装させたく外部ファイルで対応しましたが両画面とも反応が無ったため、画面ソース(head内)に挿入したところ、更新画面では実現出来て、登録画面で実現出来ないという状況です。

jQuery

1$(function(){ 2 $('input[type=text],input[type=email],input[type=number],textarea').focus(function(){ 3 $(this).addClass('focus'); 4 }).blur(function(){ 5 $(this).removeClass('focus'); 6 }); 7}); 8

試したこと

FireFox、Chrome、Edge、Safari、試せるブラウザでは全て試してみましたが、現象は同じでした。

単純なミスをしている気がしないでもないのですが解決に至りませんので、ご教示いただけましたら宜しくお願い致します。

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

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

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

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

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

mari.rinn

2020/02/01 10:12 編集

まず、外部ファイルだとダメだったのは、jQueryの読み込みを外部ファイルより下に書いたからではないですか?もしそうなら、上に書いて必ず先に読み込ませるようにしてください。 あと、$('input[type=text],, て、,が1つ多いですが、これはここでの書きミスですか?実際はどうですか? で、[type=text]これらの書き方、[type="text"]のようにクォートで囲んでみてください。
fukuboh

2020/02/01 10:22

,,はここでの誤記です。実際は $('input[type=text], となっておりました。 外部ファイルの件は外部ファイルを先に読み込むコーディングをしていました。 修正して動作確認しましたところ、まだ質問に記したとおりのままです。
m.ts10806

2020/02/01 11:09

複数セレクタ指定されてますが、1個にした場合はどうでしょうか。 念のため、ブラウザ開発ツールコンソールにエラーが出てないか確認するのを先にしてください。
fukuboh

2020/02/01 12:24

[type=text]だけでやってみましたがダメでした。 またブラウザ(Firefox)の開発コンソールではエラーは出ていない状態です。
mari.rinn

2020/02/01 12:31

キャッシュはクリアしてみましたか? それでも変化ないなら、inputに、classなりidなりをつけて、一度そのセレクタでやってみるとどうなりますか?
fukuboh

2020/02/01 12:42

キャッシュクリアはしていますがダメな状態です。 classかidをつけるやり方はちょっとやってみようと思います。
guest

回答1

0

自己解決

ダメだった側のCSSに誤り(ネスト違い)があるのを発見し改修したところ、正常に動作いたしました。
ただCSSを外部ファイルにすると2画面とも動作しなくなったので、これは今一度調査しします。
初歩的なミスでお騒がせ致しました。

投稿2020/02/01 14:43

fukuboh

総合スコア6

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問