I have created on section that includes link which open without refreshing the page for that I have added som code of ajax but after adding ajax code the webflow interactions are not working its just like disable
Here is the code that I have added
window.addEventListener('DOMContentLoaded', function() {
const contentDiv = document.getElementById('content');
// Load the initial content based on the current URL
// loadContent(window.location.pathname);
// Add a click event listener to each link
const links = document.querySelectorAll('a');
links.forEach(link => {
link.addEventListener('click', function(event) {
event.preventDefault(); // Prevent the default link behavior
const url = link.getAttribute('href'); // Get the link's URL
history.pushState({}, '', url); // Change the URL without refreshing the page
setTimeout(function() {
loadContent(url); // Load the new content based on the new URL, after a delay of 1 second
}, 1000);
});
});
// Listen for the popstate event (i.e., when the user navigates using the browser's back/forward buttons)
window.onpopstate = function(event) {
const url = window.location.pathname; // Get the current URL
loadContent(url); // Load the new content based on the current URL
};
// Load new content based on the given URL
function loadContent(url) {
// Use AJAX or other techniques to load new content based on the given URL
// For example, you could use fetch() to load new content from a server:
fetch(url)
.then(response => response.text())
.then(html => {
contentDiv.innerHTML = html; // Update the content div with the new HTML
})
.catch(error => {
console.error('Error loading content:', error);
});
}
});
Here is my public share link: LINK
([how to access public share link][2])