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
回答1件
あなたの回答
tips
プレビュー