子比主题 – 前台发布文章离开页面提示保存
这是一款子比主题用户前台发布文章的时候关闭浏览器的时候他会有一个浏览器的弹窗，就是让你保存的草稿，避免写了那么多的文章，然后不小心给关掉了，避免这样的麻烦！代码部署
将下面的代码放到：子比主题–>>自定义底部HTML代码即可，记得改一下里面的域名！
<!-- 提示编辑保存js开始-->
<script type="text/javascript">
let whiteList = ['/newposts','/posts-edit/']
let flag = whiteList.includes(window.location.pathname)? true : false
let formListenerAdded = false;
function listeningForm() {
var hasChanges = false;
var oldXHR = window.XMLHttpRequest;
setTimeout(function() {
var iframe = document.getElementById('post_content_ifr');
if (iframe) {
var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
// 创建一个observer实例
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
hasChanges = true
});
});
// 配置observer实例连接到具体的DOM元素和配置观察选项
var config = { attributes: true, childList: true, characterData: true, subtree: true };
observer.observe(iframeDoc.documentElement, config);
// 当不再需要观察时，可以断开observer
}
}, 1000);// 延迟1000毫秒后执行
// 监听所有表单输入的变化
Array.from(document.querySelectorAll('input, textarea, select')).forEach(function(element) {
element.addEventListener('input', function() {
hasChanges = true;
});
});
// 如果使用WordPress的TinyMCE编辑器，也要监听它的变化
if (typeof tinyMCE !== 'undefined') {
tinyMCE.editors.forEach(function(editor) {
editor.on('change', function() {
hasChanges = true;
});
});
}
function newXHR() {
var realXHR = new oldXHR();
realXHR.addEventListener('readystatechange', function() {
if (realXHR.readyState === 4) { // 请求完成 ' https://www.你的域名.cn/wp-admin/admin-ajax.php'
if (realXHR.responseURL =='https://www.你的域名.cn/wp-admin/admin-ajax.php') {
hasChanges= false
}
}
}, false);
return realXHR;
}
window.XMLHttpRequest = newXHR;
// 在尝试离开页面时弹出警告
window.addEventListener('beforeunload', function(event) {
if (hasChanges) {
var message = '您有未保存的更改。如果离开此页面，您可能会丢失这些更改。';
event.returnValue = message;
return message
}
});
}
document.addEventListener('DOMContentLoaded', function() {
if (!formListenerAdded && flag) {
listeningForm();
formListenerAdded = true;
}
});
</script>
<!-- 提示编辑保存js结束-->
页:
[1]