javascriptでフォームをカスタマイズしました。
ソース上は単純にinput type=file id="btnUpload"のタグのみがあるのですが、jsが読み込まれると、元々あったタグの上に、ファイルパス表示用のinput type=text id="dummy_txt" とアップロードボタン用のimg id="dummy_btn"が被せられます。
操作していて気付いたのですが、Windows7でIE9の環境だと投稿ボタンを押すと、フォーカスが#dummy_txtに飛んでしまい、#btnUploadの値が消えてしまいます。
そのまま投稿ボタンを押すと、ファイルパスがなくなっていることから選択されていないというエラーになってしまいます。
このファイルパスが消されないようにするための方法はありますか?
No.3ベストアンサー
- 回答日時:
こんにちは。
補足ありがとうございました。
ダウンロードして試してみました。
私のWindows7+IE9ではきちんとファイルも送信されていました。
>そのまま投稿ボタンを押すと、ファイルパスがなくなっていることから選択されていないというエラーになってしまいます。
何かエラーチェック等行なっているのでしょうか。
その辺もわかると解決できるかもしれません。
ただ、特定の環境とのことで、こういったプラグインのようなものを使う場合は修正が難しいかもしれません。
この回答への補足
>そのまま投稿ボタンを押すと、ファイルパスがなくなっていることから選択されていないというエラーになってしまいます。
何かエラーチェック等行なっているのでしょうか。
これについてですが、送信ボタンを押すと、#dummy_txtにフォーカスが遷移してしまい、元々の#bt-uploadにあったファイルパスが消えちゃってるようなんです。。。
このフォーカス遷移をさせないようにすれば、またなんとかなるかもとは思うのですが。。。
>私のWindows7+IE9ではきちんとファイルも送信されていました。
本当ですか!?
>何かエラーチェック等行なっているのでしょうか。
電話番号や、担当者名などの必須入力チェック等を行っております。
その辺の処理を担当している人間に聞いてみます。
ありがとうございます!
No.2
- 回答日時:
何をしているのか理解できていないjavascriptなどを利用するよりも、普通にHTMLで記しておいて、デザイン的にはCSSを利用して表示するのがよろしいのではないでしょうか。
javascriptはオフにしている閲覧者もいるので、頼りすぎると本来の機能が果たせなくなる場合があります。
No.1
- 回答日時:
こんにちは。
>javascriptでフォームをカスタマイズしました。
どのようなフォームをどのようなJavaScriptでカスタマイズしたのでしょうか。
情報が少なすぎて回答が付きにくいと思います。
もう少し詳しい情報を補足ください。
説明不足ですみません。カスタマイズしたと表現しましたが、niceform.jsというものを利用しました。
IE8や9でも動いたので、利用してたら、Windows7+IE9がダメだったので、今回の質問として投稿させてもらいました。
フォームの内容は個人のプロフィールを掲載するための登録ページになってまして、画像をアップロードできるようにしています。
niceform.jsを使用しなければ問題ないのですが、デフォルトのフォームパーツだと味気ないですし、input type=fileをCSSだけでデザインするのは、ブラウザ毎に違うため、デザイン通りにならないですし。。。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript javascriptで入力フォームが空欄の時にアラートによるエラーを出すコードを書いています。 2 2023/06/13 17:58
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript javascriptで移動ボタンを押した際に遷移するボタンを追記したい 1 2022/11/29 03:02
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
JavascriptでのExcel起動について
-
JSでファイル数取得
-
javascriptの効かないサーバー...
-
正規表現でファイル名の抽出
-
csvファイルを読み込み、該当項...
-
htmlのfileタグに自動で値を入...
-
Googleマップを社内で共有したい
-
Vba SelStart、SelLen教えてく...
-
javascript 文字列の最後から1...
-
Excel VBA にて JavaScript の...
-
ラベルの色がかわってくれない
-
JavaScriptで ブラウザの閉じる...
-
時間稼ぎの命令文とは?
-
JSPの処理の途中で、JavaScript...
-
クロスドメインでクッキーの取得
-
Webページ中の javascript をVB...
-
JavaScriptで、表を絞り込み&ソ...
-
タブブラウザで focus() を実...
-
VC#でテキストボックスに変数の...
-
C#の質問です。
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlのfileタグに自動で値を入...
-
csvファイルを読み込み、該当項...
-
ページを一回だけリロードさせ...
-
テキストファイルの更新日時を取得
-
javascriptでエクセルデータ読...
-
JavascriptでのExcel起動について
-
javascriptでフォルダ内のファ...
-
外部ファイルからの値の取得
-
JAVAスクリプトで商品コードか...
-
JSでファイル数取得
-
contenteditableで編集した内容...
-
javascriptでJSONを取得する方法
-
jsファイルを閲覧者がダウンロ...
-
JavaScript(ライブラリ)のキ...
-
InDesign javascript について
-
IEから、ローカルマシンのTEXT...
-
Win版IllustratorCS3でJavascri...
-
フォルダ内のファイル一覧
-
ディレクトリにあるファイルの...
-
直下のディレクトリのファイル...
おすすめ情報