CH 信息页面中QI 使用 Google 验证

application/views/mobile_first/ch-info-page-form.php

@@ -5,7 +5,7 @@
     
     <p>Or Submit an Inquiry Below</p>
     
-    <form action="https://www.chinahighlights.com/secureforms/qi_save" id="quick_inquiry_form" method="post" name="quick_inquiry_form" novalidate="" onsubmit="return validateQuickInquiryForm()">
+    <form action="https://www.chinahighlights.com/secureforms/qi_save" id="info_page_form" method="post" name="info_page_form" novalidate="">
     <div class="InquiryBox">
     <p><span class="inquiry_form_tag"><img alt="" height="25" src="https://data.chinahighlights.com/pic/input-name.png" width="25" /> <span class="form_required">*</span> </span> <input class="FullName" id="realname" name="realname" placeholder="Full name" type="text" /> <span id="realname_errmsg" style="display: none"><span class="requiredArea">Please enter your full name.</span></span></p>
     
@@ -15,9 +15,22 @@
     
     <p><span class="inquiry_form_tag"><img alt="" height="25" src="https://data.chinahighlights.com/pic/top10/tour-calendar.png" width="25" /> <span class="form_required">*</span></span><input class="InquiryCalendar form-control input" id="starting_date" placeholder="Starting date" readonly="readonly" tabindex="0" type="text"  name="starting_date"/><span id="starting_date_errmsg" style="display: none"><span class="requiredArea">Please enter your starting date.</span></span></p>
     <textarea id="form_additionalrequirements" name="form_additionalrequirements" placeholder="Tell us your travel ideas/interests, how many people, your hotel style…"></textarea>
-    <input name="nullemail" type="hidden"> <input name="cli_no" type="hidden" value="YDFW"><button class="sendButton" id="quick_inquiry_button" name="quick_inquiry_button" type="submit">Send My Inquiry</button></div>
+    <input name="nullemail" type="hidden"> <input name="cli_no" type="hidden" value="YDFW"><button class="sendButton" id="info_page_button" name="info_page_button" type="button">Send My Inquiry</button></div>
     </form>
     </div>
+<script src="https://www.recaptcha.net/recaptcha/api.js?render=6Lf4bfAaAAAAAEZZ9rX0ZIYfPAqACtRldSOFzl9b"></script>
+<script>
+var formEle = document.getElementById('info_page_form');
+grecaptcha.ready(function () {
+    grecaptcha.execute('6Lf4bfAaAAAAAEZZ9rX0ZIYfPAqACtRldSOFzl9b', {action: 'info_page_form'}).then(function (token) {
+        var el = document.createElement("input");
+        el.type = "hidden";
+        el.name = "__recaptcha_token__";
+        el.value = token;
+        formEle.appendChild(el);
+    });
+});
+</script>
 <script src="https://data.chinahighlights.com/js/flatpickr-4.6.1.min.js"></script>
 <script>
 document.addEventListener('DOMContentLoaded', () => {