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

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

新規登録して質問してみよう
ただいま回答率
85.48%
Google フォーム

Google フォームは、 Google社が提供しているアンケートフォーム作成および集計ができる無料のツール。Googleアカウントがあれば利用が可能です。集計データは、スプレッドシートに収集され、データ分析もできます。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

336閲覧

Googleformをデザインしてみたが、

tamin

総合スコア10

Google フォーム

Google フォームは、 Google社が提供しているアンケートフォーム作成および集計ができる無料のツール。Googleアカウントがあれば利用が可能です。集計データは、スプレッドシートに収集され、データ分析もできます。

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2022/06/26 11:16

Google forms をhtmlとcssでデザインし直して見たのですが、作動しません。送信完了ページには移動します。何かミスなどありますでしょうか?コードが汚いのは初心者なので気にしないで下さると助かります。

html

1<script src="https://www.google.com/recaptcha/api.js"></script> 2<div class="cp_iptxt"> 3<form action="https://docs.google.com/forms/u/3/d/e/1FAIpQLScrcw6cHGDUXTRU6xHxCKDMDWhfefsuhaYKZw4RSuMwAwHMBw/formResponse 4 method=" post"="" target="hidden_iframe" onsubmit="submitted=true;" class="c-form"> 5 <div class="form-group"> 6 <label for="exampleInputEmail1">メールアドレス</label><br> 7 <input name="entry.1825945873" type="email" class="form-control" id="exampleInputEmail1" placeholder="Email" required=""> 8 </div><br> 9 <div class="form-group"> 10 <label for="exampleInputEmail1">お問い合わせタイトル</label><br> 11 <input name="entry.819810545" type="text" class="form-control" id="exampleInputEmail1" placeholder="Title" required=""> 12 </div><br> 13 <label for="exampleInputEmail1">お問い合わせ内容</label><br> 14 <textarea name="entry.1832533717" class="form-control" rows="3" required="" placeholder="Content"></textarea><br><br> 15 <div class="g-recaptcha" data-callback="onSubmit" data-sitekey="6Lc#####AG4Q-zsl6BVm3E1zS#####wTompP" theme="dark"></div> 16 <!-- 送信ボタンのデフォルトをdisaledにする --> 17 <button type="submit" class="submit-button" disabled="">送信</button> 18 </form> 19 <script> 20 function onSubmit(recaptcha) { 21 if (recaptcha !== ''){ 22 // reCAPTHAによるチェックをしたあとは送信ボタンを押せるようにする 23 $('.submit-button').removeAttr('disabled'); 24 } 25 } 26 </script> 27<iframe name="hidden_iframe" id="hidden_iframe" style="display: none" onload="if(submitted){window.location='/complete.html';}"></iframe> 28 <script type="text/javascript"> 29 30 jQuery(function($){ 31 32 $( '.g-recaptcha' ).attr( 'data-theme', 'dark' ); 33 34 }); 35</script></div> 36<style> 37input { 38 box-sizing: border-box; 39 width: 100%; 40 padding: 0.3em; 41 transition: 0.3s; 42 letter-spacing: 1px; 43 color: #fff; 44 border: none; 45 border-bottom: 2px solid #ffffff; 46 background: transparent; 47} 48input:focus { 49 border-bottom: 2px solid #8277ff; 50 outline: none; 51} 52textarea { 53 box-sizing: border-box; 54 width: 100%; 55 padding: 0.3em; 56 transition: 0.3s; 57 letter-spacing: 1px; 58 color: #fff; 59 border: none; 60 border-bottom: 2px solid #ffffff; 61 background: transparent; 62} 63textarea:focus { 64 border-bottom: 2px solid #8277ff; 65 outline: none; 66} 67button { 68 width: 80%; 69 height: 50px; 70 border: 2px solid #8277ff; 71 background: transparent; 72 color: white; 73 transition: 0.5s; 74} 75button:disabled { 76 width: 0%; 77 height: 0px; 78 border: 0px solid #fff; 79 color: transparent 80} 81</style> 82

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

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

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

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

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

ho-ta-te

2022/06/29 08:58

>作動しません どこが作動しないのか、求めている動きは何なのかの記載をお願いします。 ソースをパッと見た感じだと下記が気になりました。 ・formタグのactionが閉じられていない(終わりのダブルクォーテーションがない) ・formタグのmethodの記述がおかしい
tamin

2022/06/30 11:48

ありがとう御座います。 お教え頂いた2つの項目を修正したら無事、送信できていました。 これからもいろいろな質問あるかと思いますが、その時はまたよろしくお願い致します。
guest

回答1

0

自己解決

・formタグのactionが閉じられていない(終わりのダブルクォーテーションがない)
・formタグのmethodの記述がおかしい

とのご指摘をいただき、そこを修正した結果正しく送信されました。

投稿2022/06/30 11:50

tamin

総合スコア10

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問