みかづきブログ その3

3ヶ月つづけてみました。

続・Googleフォームの見た目を強引にカスタムする(投稿完了画面編)

kimizuka.hatenablog.com

前回はGoogleフォームのフォーム画面に対し強引にスタイルを当ててみました が今回は、より強引な手段をつかって投稿完了画面を編集してみたいと思います。

以前は投稿完了画面にタグを打てたようなきがするのですが、最近ではテキストしか入れることができなくなっており、前回つくったフォームの投稿完了画面も、

f:id:kimizuka:20150817185842p:plain

こんなかんじでダイナミックさにかけていました。

そこで今回は強引な手段を用いて、投稿完了画面をよりダイナミックにしてみようと思います。


DEMO

改修のポイント

  1. body内にiframeを作成(今回はname="dummy"に設定)
  2. Googleフォームの formタグ の target を _self から dummy に変更
  3. CSSでdummyを見えなくする
  4. dummyのonloadイベントを設定(onloadで投稿完了とみなす)

これだけです。
しかし、iframeのonloadでは投稿が成功したのか失敗したのかがわからないので投稿の成功を信じて投稿完了画面を出すしかなくなります。
使いどころに注意しましょう。