我正在使用 JQuery 来处理未保存的表单数据中的更改，用户进入页面，编辑数据，尝试离开页面而不保存并且它有点工作，因为我在更改表单时收到了对话框：
上面说：“你想离开这个页面吗？你有未保存的数据，你想继续而不保存你的更改吗？”
它运行良好，并且在非常少的代码中提供了很多功能：
<script>
$(function() {
// Set the unload message whenever any input element get changed.
$(':input').on('change', function() {
setConfirmUnload(true);
});
// Turn off the unload message whenever a form get submitted properly.
$('form').on('submit', function() {
setConfirmUnload(false);
});
});
function setConfirmUnload(on) {
var message = "Vill du gå vidare utan att spara eventuella ändringar?";
window.onbeforeunload = (on) ? function() { return message; } : null;
}
</script>
与我使用的相比，上面看起来比我当前的 Java + JS 组合要好得多，它使用隐藏的表单变量来判断表单数据是否已更改，然后在 Java 和 JS 上进行测试以启用根据我的规范的警告：
以上是它应该看起来的样子。问题是，我希望用户能够更改表单并将其提交到页面而不会收到警告，并且我还想从警告中排除搜索框“fastseach”，因此可以排除组件吗？以及如何将对话框的显示更改为我自己的？我自己的对话框是这样绘制的：
// is this necessary?
function doAsk(title, msg, action, command, actionNo, commandNo, search) {
document.getElementById("fastsearch").value = search;
document.actionForm.saveStatus.value = ''
var funcYes = 'doYes()';
var funcNo = 'hideDialog()';
if (title == 'Fel') {
var s = "<div style=\"position:absolute; z-index:1000001; left:15%; top:75%; font-size: 70% \"><input id=\"dialogaterga\" style=\"font-family:calibri; width:70px; float:right; margin-right:35px;\" type=button onclick=\"javascript:"
+ funcNo + "\" value=\"Återgå\" /></div>";
showDialog(title, msg + s);
} else if (title == 'Varning') {
var v = "<div style=\"position:absolute; z-index:1000001; left:15%; top:75%\"><input style=\"font-family:calibri; width:70px\" type=button onclick=\"javascript:"
+ funcNo
+ "\" value=\"Nej\" /></div><div style=\"position:absolute; left:70%; top:75%\"><input id=\"dialogwarnyes\" style=\"font-family:calibri; width:70px\" type=button onclick=\"javascript:doSubmit('"
+ action + "','" + command + "'); \" value=\"Ja\" /></div>";
showDialog(title, msg + v);
} else if (title == 'Information') {
var i = "<div style=\"position:absolute; z-index:1000001; left:70%; top:75%\"><input type=button class=\"dialogbuttonlink\" id=\"dialogstang\" onclick=\"javascript:hideDialog()\" value=\"Stäng\" /></div>";
showDialog(title, msg + i, true);
} else if (title == 'Fel2') {
title = 'Fel';
var s2 = "<div style=\"position:absolute; z-index:1000001; left:15%; top:75%; font-size: 70% \"><input id=\"dialogaterga\" style=\"font-family:calibri; width:70px; float:right; margin-right:35px;\" type=button onclick=\"javascript:"
+ funcNo + "\" value=\"OK\" /></div>";
showDialog(title, msg + s2);
}
initFocus();
}
function showDialog(title, message, autohide) {
//alert("showdialog");
var type = 'prompt';
var dialog;
var dialogheader;
var dialogclose;
var dialogtitle;
var dialogcontent;
var dialogmask;
var link1
var link2
if (!document.getElementById('dialog')) {
dialog = document.createElement('div');
dialog.id = 'dialog';
link2 = document.createElement('a');
link2.id = 'modalFocusLink';
link2.setAttribute('onclick', 'return false');
link2.setAttribute('onblur', 'redirectFocus');
link2.setAttribute('href', '#');
dialog.appendChild(link2);
dialogheader = document.createElement('div');
dialogheader.id = 'dialog-header';
dialogtitle = document.createElement('div');
dialogtitle.id = 'dialog-title';
dialogclose = document.createElement('div');
dialogclose.id = 'dialog-close'
dialogcontent = document.createElement('div');
dialogcontent.id = 'dialog-content';
dialogmask = document.createElement('div');
dialogmask.id = 'dialog-mask';
document.body.appendChild(dialogmask);
document.body.appendChild(dialog);
dialog.appendChild(dialogheader);
dialogheader.appendChild(dialogtitle);
dialogheader.appendChild(dialogclose);
dialog.appendChild(dialogcontent);
dialogclose.setAttribute('onclick', 'hideDialog()');
dialogclose.onclick = hideDialog;
link1 = document.createElement('a');
link1.id = 'modalBlurLink';
link1.setAttribute('onclick', 'return false');
link1.setAttribute('onfocus', 'redirectFocus');
link1.setAttribute('href', '#');
dialog.appendChild(link1);
} else {
dialog = document.getElementById('dialog');
dialogheader = document.getElementById('dialog-header');
dialogtitle = document.getElementById('dialog-title');
dialogclose = document.getElementById('dialog-close');
dialogcontent = document.getElementById('dialog-content');
dialogmask = document.getElementById('dialog-mask');
dialogmask.style.visibility = "visible";
dialog.style.visibility = "visible";
}
dialog.style.opacity = .00;
dialog.style.filter = 'alpha(opacity=0)';
dialog.alpha = 0;
var width = pageWidth();
var height = pageHeight();
var left = leftPosition();
var top = topPosition();
var dialogwidth = dialog.offsetWidth;
var dialogheight = dialog.offsetHeight;
var topposition = 33;// top + (height / 3) - (dialogheight / 2);
var leftposition = width - dialogwidth - 30; // left + (width / 2) -
// (dialogwidth / 2);
dialog.style.top = topposition + "px";
dialog.style.left = leftposition + "px";
dialogheader.className = type + "header";
dialogtitle.innerHTML = title;
dialogcontent.className = type;
dialogcontent.innerHTML = message;
var content = document.getElementById(WRAPPER);
dialogmask.style.height = content.offsetHeight + 'px';
if (title == 'Information') {
dialog.alpha = 100;
dialog.style.opacity = (1.0);
dialog.style.filter = 'alpha(opacity=' + 100 + ')';
dialog.style.visibility = "visible";
dialogmask.style.visibility = "hidden";
var fodi = document.getElementById("dialogstang");
fodi.focus();
} else {
if (title == 'Fel') {
var fo = document.getElementById("dialogaterga");
fo.focus();
} else if (title == 'Varning') {
var vafo = document.getElementById("dialogwarnyes");
vafo.focus();
}
dialog.timer = setInterval("fadeDialog(1)", TIMER);
if (autohide) {
dialogclose.style.visibility = "hidden";
// window.setTimeout("hideDialog()", (autohide * 1000));
} else {
dialogclose.style.visibility = "visible";
}
if (title == 'invisible')
dialog.style.visibility = "hidden";
}
}
我想排除的组件可能是“更新”按钮，因为按下“更新”不应激活警告，只会离开页面。你能帮助我吗？