水灯节表单改正重复显示余票信息

master
黄文强@HWQ-PC 11 months ago
parent 688be20f80
commit d8103fd078

@ -34,9 +34,11 @@
<div class="optionLable" id="ticket_type_vip_khomloy">
<input type="radio" value="VIP+Transfer+Dinner" id="vip_khomloy" data-price="169" name="ticket_type">
<label for="vip_khomloy" style="font-size:18px;">
VIP+Transfer+Dinner
<div class="selectionMemo">
US$179 (5900THB)
<div>
VIP+Transfer+Dinner
<div class="selectionMemo">
US$179 (5900THB)
</div>
</div>
</label>
</div>
@ -410,55 +412,93 @@
var ticket_date_november15th = document.getElementById("ticket_date_november15th");
var ticket_date_november16th = document.getElementById("ticket_date_november16th");
ticket_date_november15th.addEventListener('click', function () {
addStyledLabel("ticket_type_premium_khomloy", "60 left");
addStyledLabel("ticket_type_vip_khomloy", " 135 left");
addStyledLabel("ticket_type_standard_khomloy", "Sold out");
});
ticket_date_november16th.addEventListener('click', function () {
addStyledLabel("ticket_type_premium_khomloy", "240 left");
addStyledLabel("ticket_type_vip_khomloy", " 155 left");
addStyledLabel("ticket_type_standard_khomloy", "30 left");
});
function removeExistingLabels(targetId, labelClass) {
document.addEventListener('DOMContentLoaded', function () {
function initDefaultSelection() {
// 初始化时添加默认的余量信息
addStyledLabel("ticket_type_premium_khomloy", "60 tickets left", "dynamic-label");
addStyledLabel("ticket_type_vip_khomloy", "135 tickets left", "dynamic-label");
addStyledLabel("ticket_type_standard_khomloy", "Sold out", "dynamic-label");
}
// 初始化默认显示
initDefaultSelection();
var ticket_date_november15th = document.getElementById("ticket_date_november15th");
var ticket_date_november16th = document.getElementById("ticket_date_november16th");
ticket_date_november15th.addEventListener('click', function () {
console.log("ticket_date_november15th clicked");
// 先移除旧的标签
removeExistingLabels("ticket_type_premium_khomloy", "dynamic-label");
removeExistingLabels("ticket_type_vip_khomloy", "dynamic-label");
removeExistingLabels("ticket_type_standard_khomloy", "dynamic-label");
// 添加新的余量标签
addStyledLabel("ticket_type_premium_khomloy", "60 tickets left", "dynamic-label");
addStyledLabel("ticket_type_vip_khomloy", "135 tickets left", "dynamic-label");
addStyledLabel("ticket_type_standard_khomloy", "Sold out", "dynamic-label");
});
ticket_date_november16th.addEventListener('click', function () {
console.log("ticket_date_november16th clicked");
// 先移除旧的标签
removeExistingLabels("ticket_type_premium_khomloy", "dynamic-label");
removeExistingLabels("ticket_type_vip_khomloy", "dynamic-label");
removeExistingLabels("ticket_type_standard_khomloy", "dynamic-label");
// 添加新的余量标签
addStyledLabel("ticket_type_premium_khomloy", "240 tickets left", "dynamic-label");
addStyledLabel("ticket_type_vip_khomloy", "155 tickets left", "dynamic-label");
addStyledLabel("ticket_type_standard_khomloy", "Sold out", "dynamic-label");
});
});
// 添加新的余量信息标签
function addStyledLabel(targetId, text, labelClass) {
var target = document.getElementById(targetId);
if (target) {
var labelsToRemove = target.querySelectorAll('label.' + labelClass);
labelsToRemove.forEach(function(label) {
target.removeChild(label);
});
// 移除旧的余量标签
removeExistingLabels(targetId, labelClass);
// 找到现有的 <label> 元素
var existingLabel = target.querySelector('label[for]'); // 查找带有 for 属性的 label 元素
if (existingLabel) {
// 找到 `selectionMemo` 元素
var selectionMemo = existingLabel.querySelector('.selectionMemo');
if (selectionMemo) {
// 创建并添加新的标签
var newLabel = document.createElement('label');
newLabel.style.fontSize = '18px';
newLabel.textContent = text;
newLabel.classList.add(labelClass);
// 将新标签插入到 `selectionMemo` 之后
selectionMemo.parentNode.insertBefore(newLabel, selectionMemo.nextSibling);
} else {
console.error('SelectionMemo element not found within label.');
}
} else {
console.error('Existing label not found within target ID:', targetId);
}
} else {
console.error('Element not found for ID:', targetId);
}
}
document.addEventListener('DOMContentLoaded', function () {
// 手动调用处理显示的函数
function initDefaultSelection() {
removeExistingLabels("ticket_type_premium_khomloy", "dynamic-label");
addStyledLabel("ticket_type_premium_khomloy", "(60)", "dynamic-label");
addStyledLabel("ticket_type_vip_khomloy", " (135)", "dynamic-label");
addStyledLabel("ticket_type_standard_khomloy", "Sold out", "dynamic-label");
}
// 调用初始化函数以设置默认显示
initDefaultSelection();
});
function addStyledLabel(targetId, text, labelClass) {
// 移除旧的余量标签
function removeExistingLabels(targetId, labelClass) {
var target = document.getElementById(targetId);
if (target) {
removeExistingLabels(targetId, labelClass);
var label = document.createElement('label');
label.style.fontSize = '18px';
label.textContent = text;
label.classList.add(labelClass);
target.appendChild(label);
} else {
console.error('Element not found for ID:', targetId);
var existingLabels = target.querySelectorAll('.' + labelClass);
existingLabels.forEach(function(label) {
label.parentNode.removeChild(label);
});
}
}
var venueList = document.querySelectorAll("input[name='Venue']");
var totalPriceText = document.getElementById("totalPriceText");

Loading…
Cancel
Save