将事件处理附加到菜单和按钮

Attaching event handling to menus and buttons

本文关键字：菜单 按钮 事件处理      更新时间：2023-09-26

我正在使用IE8。因此，请求放置适用于IE8的解决方案。

这个问题由来已久。我在 jsp 中有一个很大的形式。用户填写表单。错误地按下不可编辑文本框上的退格键，输入的数据全部丢失。

为了警告用户，我编写了以下代码：

window.onbeforeunload = function() { 
     return "Your work will be lost."; 
};

但是，现在此警报适用于所有链接，菜单和按钮以及退格键，即使页面卸载在这些情况下有效。

我通过在 onclick 事件上调用一个函数来解决超链接：

var link_was_clicked = false;
window.onbeforeunload = function() { 
    if(link_was_clicked){
        return;
    }
    return "Your work will be lost."; 
}; 
var elements = document.getElementsByTagName('a');
for(var i = 0, len = elements.length; i < len; i++) {
    elements[i].onclick = function () {
        link_was_clicked = true;
    }
}

这按预期工作。

但是，我不知道如何对页面上的菜单和按钮执行相同的操作。

我正在使用数组作为菜单：

var menus = new Array();
menus[0] = new menu( .. and so on

项目被添加到菜单中，如下所示：

menus[0].addItem("javascript:loadMyHome();", "", 65, "left", "&nbsp;MyHome", 0);

loadMyHome()正在提交：

document.myFormName.submit();

同样，按钮定义为：

<INPUT TYPE="button" value="MyButton"  onClick="funcMyButton()" />

funcMyButton()还提交了：

document.myFormName.submit();

感谢您的阅读！

对于退格键，为什么不包括一个window.addEventListener("keydown",onKeyDown,false); 然后稍后在你的代码中具有以下函数： function onKeyDown(e) { if(e.keyCode == 8) do blah; 8 是退格键的字符代码。同样，如果要对网页的其他元素执行相同的操作，请使用对象。例如：Object.Menu1 = document.getElementById('menuId'); 然后：Object.Menu1.addEventListener("keydown",onKeyDown,false); 希望这有帮助！

另一种方法是在按下退格键且当前没有文本字段处于焦点时触发警报。

.JS：

window.addEventListener('keydown', function(event){
    if(event.keyCode === 8 && document.activeElement.type !== 'text') {
        event.preventDefault();
        alert('Your work will be lost.');
    }
});

使用 IE8 支持（未经测试）：

.JS：

var _win = window;
if (_win.addEventListener) {
    _win.addEventListener('keydown', showWarning, false);
} else {
    _win.attachEvent('keydown', showWarning);
}
function showWarning(event){
    if(event.keyCode === 8 && document.activeElement.type !== 'text') {
        event.preventDefault();
        alert('Your work will be lost.');
    }
});
相关文章：