JS修改,使用线路页面表单JS

master
candice 1 year ago
parent 3a508cea72
commit e3abc9bcff

@ -429,257 +429,121 @@
--> -->
</div> </div>
</div> </div>
<script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script> <script src="https://www.recaptcha.net/recaptcha/enterprise.js?render=6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja"></script>
<script src="https://data.asiahighlights.com/min/?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script> <script src="https://data.chinahighlights.com/js/min.php?f=/js/jquery-1.8.2.min.js,/js/flatpickr-4.6.1.min.js"></script>
<script> <script>
function validateQuickInquiryForm() {
var selectedExpectedDate = ''; var result = true;
document.addEventListener('DOMContentLoaded', () => { var realnameVal = document.getElementById("realname").value;
flatpickr("#starting_date", { var emailVal = document.getElementById("email").value;
dateFormat: "Y-m-d", var startingDateVal = document.getElementById("starting_date").value;
altInput: true, var phoneVal = document.getElementById("PhoneNo").value;
altFormat: "F j, Y",
disableMobile: true, var startingDateErrEl = document.getElementById("starting_date_errmsg");
minDate: "today" var realnameErrEl = document.getElementById("realname_errmsg");
}); var emailErrEl = document.getElementById("email_errmsg");
var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
var quick_inquiry_button = document.getElementById("quick_inquiry_button"); var phoneErrEl = document.getElementById("phone_errmsg");
var quick_inquiry_form = document.getElementById("quick_inquiry_form"); var travelGroupErrEl = document.getElementById("group_error_msg");
quick_inquiry_button.addEventListener('click', function(event) { if (realnameErrEl) realnameErrEl.style.display = 'none';
var validateResult = validateQuickInquiryForm(); if (emailErrEl) emailErrEl.style.display = 'none';
if (validateResult) { if (emailVerifyErrEl) emailVerifyErrEl.style.display = 'none';
if (typeof(grecaptcha) === "undefined") { if (startingDateErrEl) startingDateErrEl.style.display = 'none';
console.warn('grecaptcha is disabled.'); if (phoneErrEl) phoneErrEl.style.display = 'none';
quick_inquiry_form.submit(); if (travelGroupErrEl) travelGroupErrEl.style.display = 'none';
} else {
grecaptcha.enterprise.ready(async () => { var travelGroupList = document.querySelectorAll('input[name="travel_group"]');
const token = await grecaptcha.enterprise.execute('6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja', {action: 'ADD_TO_CART'}); var travelGroupChecked = false;
var el = document.createElement("input"); travelGroupList.forEach(function(groupNode) {
el.type = "hidden"; if (groupNode.checked) {
el.name = "__grecaptcha_token__"; travelGroupChecked = true;
el.value = token; }
quick_inquiry_form.appendChild(el);
quick_inquiry_form.submit();
quick_inquiry_button.innerText = "Submitted successfully";
});
}
}
});
}); });
function validateQuickInquiryForm() { if (!travelGroupChecked) {
var result = true; travelGroupErrEl.style.display = '';
var realnameVal = document.getElementById("realname").value; result = false;
var emailVal = document.getElementById("email").value; }
var expectedDateVal = document.getElementById("starting_date").value;
var expectedMonthVal = document.getElementById("expectedMonth").value;
var contactVal = document.getElementById("PhoneNo").value;
var realnameErrEl = document.getElementById("realname_errmsg");
var emailErrEl = document.getElementById("email_errmsg");
var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
var startingDateErrEl = document.getElementById("date_error_msg");
var contactErrEl = document.getElementById("phone_errmsg");
var groupErrEl = document.getElementById("group_error_msg");
realnameErrEl.style.display = 'none';
emailErrEl.style.display = 'none';
emailVerifyErrEl.style.display = 'none';
startingDateErrEl.style.display = 'none';
contactErrEl.style.display = 'none';
groupErrEl.style.display = 'none';
var travel_group_is_checked = false;
document.querySelectorAll('input[name="travel_group"]').forEach(function(groupNode) {
if (groupNode.checked) {
travel_group_is_checked = true;
}
});
if (travel_group_is_checked === false) {
groupErrEl.style.display = '';
result = false;
}
var tripDate_is_checked = false;
if (selectedExpectedDate === 'exact') {
tripDate_is_checked = expectedDateVal !== '';
} else if (selectedExpectedDate === 'approximate') {
tripDate_is_checked = expectedMonthVal !== '';
} else if (selectedExpectedDate === 'yet') {
tripDate_is_checked = true;
}
//时间选择
if (!tripDate_is_checked) {
startingDateErrEl.style.display = '';
result = false;
}
if (realnameVal === '') { if (realnameVal === '') {
realnameErrEl.style.display = ''; realnameErrEl.style.display = '';
result = false; result = false;
} }
if (emailVal === '') { if (emailVal === '') {
emailErrEl.style.display = ''; emailErrEl.style.display = '';
result = false; result = false;
} else { } else {
var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/; var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
if (!emailPattern.test(emailVal)) { if (!emailPattern.test(emailVal) && emailVerifyErrEl) {
emailVerifyErrEl.style.display = ''; emailVerifyErrEl.style.display = '';
result = false;
}
}
if (contactVal === '') {
contactErrEl.style.display = '';
result = false; result = false;
} }
return result;
} }
</script> if (startingDateVal === '') {
<script> startingDateErrEl.style.display = '';
result = false;
$(function () { }
var $adultBlock = $('#adultBlock'); if (phoneVal === '') {
var $childrenBlock = $('#childrenBlock'); phoneErrEl.style.display = '';
$('input[name="travel_group"]').each((i, groupEle) => { result = false;
$(groupEle).click(function (e) { }
return result;
var currentTarget = e.currentTarget; }
if (currentTarget.id === 'Family' || currentTarget.id === 'Other' ) { document.addEventListener('DOMContentLoaded', () => {
$adultBlock.show(); flatpickr("#starting_date", {
$childrenBlock.show(); dateFormat: "Y-m-d",
} else { altInput: true,
$adultBlock.show(); altFormat: "F j, Y",
$childrenBlock.hide(); disableMobile: true,
} minDate: "today"
}) });
});
var $tripDateBlock = $('#tripDateBlock');
var $expectedMonth = $('#expectedMonth');
var $expectedDate = $('#starting_date');
var $dateSelectionBlock = $('#dateSelectionBlock');
var $flatpickrBlock = $('#flatpickrBlock');
$('input[name="trip_date"]').each((i, tripDateEle) => {
$(tripDateEle).click(function (e) {
$expectedDate.val('');
$expectedMonth.val('');
$tripDateBlock.show();
var selectedTripDate = e.currentTarget;
selectedExpectedDate = selectedTripDate.id;
if (selectedTripDate.id === 'exact') {
$dateSelectionBlock.show();
$expectedMonth.hide();
$flatpickrBlock.show();
} else if (selectedTripDate.id === 'approximate') {
$dateSelectionBlock.show();
$flatpickrBlock.hide();
$expectedMonth.show();
} else if (selectedTripDate.id === 'yet') {
$dateSelectionBlock.hide();
$flatpickrBlock.hide();
}
})
});
var tripLength = $('#tripLengthNumber').val();
// Trip Length
$('#tripLengthPlus').click(function () {
tripLength++;
$('#tripLengthNumber').val(tripLength);
});
$('#tripLengthMinus').click(function () { var quick_inquiry_form = document.getElementById('quick_inquiry_form');
if (tripLength > 1) { var quick_inquiry_button = document.getElementById('quick_inquiry_button');
tripLength--;
$('#tripLengthNumber').val(tripLength); quick_inquiry_button.addEventListener('click', function(evt) {
} if (validateQuickInquiryForm()) {
}); if (typeof(grecaptcha) === "undefined") {
}) console.warn('grecaptcha is disabled.');
</script> quick_inquiry_form.submit();
<script> } else {
// 折叠展开 grecaptcha.enterprise.ready(async () => {
const token = await grecaptcha.enterprise.execute('6Lf828MhAAAAANNetijCXKwW5ARyhcJ-b1Hhslja', {action: 'ADD_TO_CART'});
var el = document.createElement("input");
el.type = "hidden";
el.name = "__grecaptcha_token__";
el.value = token;
quick_inquiry_form.appendChild(el);
quick_inquiry_form.submit();
quick_inquiry_form.innerText = "Submitted successfully";
});
}
}
});
});
document.querySelectorAll('div[collapse]').forEach(function ($collapseDiv, index) { </script>
$collapseDiv.onclick = function (e) { <script>
let collapseStatus = $collapseDiv.getAttribute('collapse-status');
let targetId = $collapseDiv.getAttribute("data-target");
let targetIconId = $collapseDiv.getAttribute("data-target-icon");
let $targetElement = document.getElementById(targetId);
let $targetIcon = document.getElementById(targetIconId);
if (collapseStatus == undefined || collapseStatus == "show") {
$targetIcon.classList.remove("CloseIcon");
$targetIcon.classList.add("OpenIcon");
$collapseDiv.setAttribute("collapse-status", "hide");
slideUp($targetElement);
} else {
$targetIcon.classList.remove("OpenIcon");
$targetIcon.classList.add("CloseIcon");
$collapseDiv.setAttribute("collapse-status", "show");
slideDown($targetElement);
}
}
});
function slideUp(target, duration) {
duration = duration ? duration : 500;
target.style.transitionProperty = 'height, margin, padding';
target.style.transitionDuration = duration + 'ms';
target.style.boxSizing = 'border-box';
target.style.height = target.offsetHeight + 'px';
target.offsetHeight;
target.style.overflow = 'hidden';
target.style.height = 0;
target.style.paddingTop = 0;
target.style.paddingBottom = 0;
target.style.marginTop = 0;
target.style.marginBottom = 0;
window.setTimeout(() => {
target.style.display = 'none';
target.style.removeProperty('height');
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
function slideDown(target, duration) { $(function () {
duration = duration ? duration : 500; var $adultBlock = $('#adultBlock');
target.style.removeProperty('display'); var $childrenBlock = $('#childrenBlock');
let display = window.getComputedStyle(target).display; $('input[name="travel_group"]').each((i, groupEle) => {
if (display === 'none') $(groupEle).click(function (e) {
display = 'block';
target.style.display = display; var currentTarget = e.currentTarget;
let height = target.offsetHeight; if (currentTarget.id === 'Family' || currentTarget.id === 'Other' ) {
target.style.overflow = 'hidden'; $adultBlock.show();
target.style.height = 0; $childrenBlock.show();
target.style.paddingTop = 0; } else {
target.style.paddingBottom = 0; $adultBlock.show();
target.style.marginTop = 0; $childrenBlock.hide();
target.style.marginBottom = 0; }
target.offsetHeight; })
target.style.boxSizing = 'border-box'; });
target.style.transitionProperty = "height, margin, padding"; })
target.style.transitionDuration = duration + 'ms'; </script>
target.style.height = height + 'px';
target.style.removeProperty('padding-top');
target.style.removeProperty('padding-bottom');
target.style.removeProperty('margin-top');
target.style.removeProperty('margin-bottom');
window.setTimeout(() => {
target.style.removeProperty('height');
target.style.removeProperty('overflow');
target.style.removeProperty('transition-duration');
target.style.removeProperty('transition-property');
}, duration);
}
</script>
<style> <style>
.date_select {width: 27.5% !important; margin-bottom: 10px;} .date_select {width: 27.5% !important; margin-bottom: 10px;}
.age_range { margin-top: 45px;} .age_range { margin-top: 45px;}

Loading…
Cancel
Save