Trying to prevent closing/refreshing with beforeunload and an embedded typeform but it doesn't seem to display the warning message. Is there something I'm missing?
<html>
<body>
<script>
window.addEventListener("beforeunload", function(event) {
event.returnValue = "";
});
</script>
<div class="relative pt-16 m-auto overflow-hidden" style="height: 700px">
<iframe
id="typeform-full"
width="100%"
height="100%"
frameborder="0"
allow="camera; microphone; autoplay; encrypted-media;"
src="https://form.typeform.com/to/AQlHXdch?typeform-medium=embed-snippet"
></iframe>
<script>
type="text/javascript"
src="https://embed.typeform.com/embed.js"
</script>
</div>
</body>
</html>
My Answer:
One possible issue could be that the typeform is not fully loaded before the beforeunload event is triggered. Make sure that the typeform is fully loaded and ready before trying to prevent the user from closing or refreshing the page.
Another issue could be that the beforeunload event is being overridden by other event listeners or scripts on the page. Make sure that there are no conflicting scripts that are preventing the beforeunload event from firing.
You can also try using the event.returnValue property to display a custom message in the confirmation dialog. Here is an example code snippet:
javascript
window.addEventListener('beforeunload', function (e) {
e.returnValue = 'Are you sure you want to leave this page?';
});
If none of these solutions work, you may need to provide more information or code snippets for further assistance.
Rate this post
3 of 5 based on 7772 votesComments