- End * 3. Priority: 1(oder höher) */(function () { 'use strict';function enhanceElementorForms() { // Alle Elementor Formularfelder finden const formFields = document.querySelectorAll('.elementor-form .elementor-field-group');formFields.forEach(function (fieldGroup, index) { const input = fieldGroup.querySelector('input, textarea, select'); if (!input) return;// Wenn bereits ein Label existiert, überspringen const existingLabel = fieldGroup.querySelector('label'); if (existingLabel && existingLabel.textContent.trim()) return;// Text aus Placeholder oder Field-Label holen const labelText = input.placeholder || input.getAttribute('aria-label') || fieldGroup.querySelector('.elementor-field-label')?.textContent || 'Feld ' + (index + 1);// Eindeutige ID generieren if (!input.id) { input.id = 'form-field-' + input.name || 'field-' + index + '-' + Date.now(); }// Label-Element erstellen const label = document.createElement('label'); label.setAttribute('for', input.id); label.textContent = labelText; label.className = 'elementor-field-label elementor-screen-only sr-only';// Label vor dem Input einfügen input.parentNode.insertBefore(label, input);// aria-label hinzufügen (für Screenreader) if (!input.getAttribute('aria-label')) { input.setAttribute('aria-label', labelText); }// Prüfung auf Pflichtfelder - required Attribute, Klasse oder * im Placeholder const hasRequiredAttr = input.required; const hasRequiredClass = input.classList.contains('elementor-field-required') || fieldGroup.classList.contains('elementor-field-required'); const hasAsteriskInPlaceholder = input.placeholder && input.placeholder.includes('*');if (hasRequiredAttr || hasRequiredClass || hasAsteriskInPlaceholder) { input.setAttribute('aria-required', 'true');// Wenn required Attribute fehlt, aber * im Placeholder ist, hinzufügen if (!input.required && hasAsteriskInPlaceholder) { input.required = true; }// Sternchen zum Label hinzufügen if (!label.textContent.includes('*')) { const requiredSpan = document.createElement('span'); requiredSpan.className = 'required-indicator'; requiredSpan.setAttribute('aria-hidden', 'true'); requiredSpan.textContent = ' *'; label.appendChild(requiredSpan); } }// Zusätzliche ARIA-Attribute basierend auf Input-Typ if (input.type === 'email') { input.setAttribute('aria-describedby', input.id + '-desc'); } if (input.type === 'tel') { input.setAttribute('inputmode', 'tel'); } });// aria-label zu Submit-Buttons hinzufügen const submitButtons = document.querySelectorAll('.elementor-form button[type="submit"], .elementor-form .elementor-button'); submitButtons.forEach(function (button) { if (!button.getAttribute('aria-label')) { const buttonText = button.textContent.trim() || 'Absenden'; button.setAttribute('aria-label', buttonText); } });// Role und aria-label zum Formular hinzufügen const forms = document.querySelectorAll('.elementor-form'); forms.forEach(function (form, index) { if (!form.getAttribute('aria-label')) { form.setAttribute('aria-label', 'Kontaktformular'); } if (!form.getAttribute('role')) { form.setAttribute('role', 'form'); } });// aria-live für Fehlermeldungen const errorMessages = document.querySelectorAll('.elementor-message'); errorMessages.forEach(function (msg) { msg.setAttribute('aria-live', 'polite'); msg.setAttribute('role', 'alert'); }); }// Skip Link Korrektur - Ziel für #content prüfen function fixSkipLink() { const skipLink = document.querySelector('a[href="#content"]'); const contentTarget = document.getElementById('content');if (skipLink && !contentTarget) { // Hauptinhaltsbereich finden und id="content" hinzufügen const mainContent = document.querySelector('.elementor-location-single, .site-main, main, [data-elementor-type="wp-page"]'); if (mainContent) { mainContent.id = 'content'; mainContent.setAttribute('role', 'main'); mainContent.setAttribute('tabindex', '-1'); } } }// Fokus-Sichtbarkeit verbessern function enhanceFocusVisibility() { const style = document.createElement('style'); style.textContent = ` /* Barrierefreiheit: Fokus-Indikator */ a:focus, button:focus, input:focus, textarea:focus, select:focus, [tabindex]:focus { outline: 2px solid #005fcc !important; outline-offset: 2px !important; } /* Klasse nur für Screenreader */ .sr-only, .elementor-screen-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } /* sr-only im Fokus anzeigen (für Skip Links) */ .sr-only:focus, .elementor-screen-only:focus { position: static !important; width: auto !important; height: auto !important; padding: 0.5rem 1rem !important; margin: 0 !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } `; document.head.appendChild(style); }// Beim Laden der Seite ausführen function init() { enhanceElementorForms(); fixSkipLink(); enhanceFocusVisibility();// MutationObserver für Elementor Popups const observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { if (mutation.addedNodes.length) { enhanceElementorForms(); } }); });observer.observe(document.body, { childList: true, subtree: true }); }// DOM Ready Check if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', init); } else { init(); }// Auch nach Elementor Frontend Init ausführen if (typeof jQuery !== 'undefined') { jQuery(window).on('elementor/frontend/init', function () { setTimeout(enhanceElementorForms, 500); }); }})();