Skip to content

菜单相关事件

自定义菜单事件

OnCustomMenuCmd2

语法

javascript
OnCustomMenuCmd2(menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID)

参数

名称必选/可选数据类型说明
menuPos必选long一级菜单位置
submenuPos必选long二级菜单位置
subsubmenuPos必选long三级菜单位置
menuCaption必选string自定义菜单名称
myMenuID必选long自定义菜单ID

说明

该事件在用户单击自定义主菜单中的项目时执行。 各个参数的含义请参考AddCustomMenuItem2方法。

注意:在事件中可以通过判断ID和menuCaption两种方式,在对点击菜单事件进行相应操作。而且这个事件并不能捕获在文件菜单下面的菜单项,如果需要此功能参见OnCustomFileMenuCmd事件。

示例代码

javascript
// 自定义菜单命令事件处理
function OnCustomMenuCmd2(menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID) {
    console.log("菜单点击事件:");
    console.log("一级菜单位置:", menuPos);
    console.log("二级菜单位置:", submenuPos);
    console.log("三级菜单位置:", subsubmenuPos);
    console.log("菜单标题:", menuCaption);
    console.log("菜单ID:", myMenuID);
    
    // 根据菜单ID处理不同操作
    switch(myMenuID) {
        case 100:
            handleNewDocument();
            break;
        case 101:
            handleOpenDocument();
            break;
        case 102:
            handleSaveDocument();
            break;
        case 103:
            handlePrintDocument();
            break;
        default:
            console.log("未知菜单命令:", myMenuID);
    }
    
    // 根据菜单标题处理操作
    switch(menuCaption) {
        case "新建文档":
            handleNewDocument();
            break;
        case "打开文档":
            handleOpenDocument();
            break;
        case "保存文档":
            handleSaveDocument();
            break;
        case "打印文档":
            handlePrintDocument();
            break;
        default:
            console.log("未知菜单标题:", menuCaption);
    }
}

// 处理新建文档
function handleNewDocument() {
    console.log("执行新建文档操作");
    // 创建新文档
    // 初始化文档
    // 设置默认属性
}

// 处理打开文档
function handleOpenDocument() {
    console.log("执行打开文档操作");
    // 显示文件选择对话框
    // 打开选中的文档
    // 加载文档内容
}

// 处理保存文档
function handleSaveDocument() {
    console.log("执行保存文档操作");
    // 保存当前文档
    // 更新文档状态
    // 记录保存日志
}

// 处理打印文档
function handlePrintDocument() {
    console.log("执行打印文档操作");
    // 显示打印预览
    // 设置打印参数
    // 执行打印操作
}

OnCustomFileMenuCmd

语法

javascript
OnCustomFileMenuCmd(menuIndex, menuCaption, menuID)

参数

名称必选/可选数据类型说明
menuIndex必选long自定义文件菜单位置索引
menuCaption必选string自定义文件菜单名称
menuID可选long自定义文件菜单ID

说明

该事件在用户单击自定义文件菜单中的项目时执行。 第一个参数是菜单索引,从0开始计算;第二个参数是菜单标题;第三个参数是调用AddFileMenuItem方法增加主菜单项目时的第4个参数,也就是自定义的菜单ID。

注意:在事件中可以通过判断ID和menuCaption两种方式,在对点击菜单事件进行相应操作。此事件只能捕获在文件菜单下面的菜单项,如果需要此功能参见OnCustomFileMenuCmd事件。

示例代码

javascript
// 自定义文件菜单命令事件处理
function OnCustomFileMenuCmd(menuIndex, menuCaption, menuID) {
    console.log("文件菜单点击事件:");
    console.log("菜单索引:", menuIndex);
    console.log("菜单标题:", menuCaption);
    console.log("菜单ID:", menuID);
    
    // 根据菜单ID处理不同操作
    switch(menuID) {
        case 300:
            handleCustomSave();
            break;
        case 301:
            handleCustomExport();
            break;
        case 302:
            handleCustomImport();
            break;
        case 303:
            handleCustomBackup();
            break;
        default:
            console.log("未知文件菜单命令:", menuID);
    }
    
    // 根据菜单标题处理操作
    switch(menuCaption) {
        case "自定义保存":
            handleCustomSave();
            break;
        case "自定义导出":
            handleCustomExport();
            break;
        case "自定义导入":
            handleCustomImport();
            break;
        case "自定义备份":
            handleCustomBackup();
            break;
        default:
            console.log("未知文件菜单标题:", menuCaption);
    }
}

// 处理自定义保存
function handleCustomSave() {
    console.log("执行自定义保存操作");
    // 执行自定义保存逻辑
    // 保存到指定位置
    // 更新文档状态
}

// 处理自定义导出
function handleCustomExport() {
    console.log("执行自定义导出操作");
    // 选择导出格式
    // 设置导出参数
    // 执行导出操作
}

// 处理自定义导入
function handleCustomImport() {
    console.log("执行自定义导入操作");
    // 选择导入文件
    // 解析文件内容
    // 导入到当前文档
}

// 处理自定义备份
function handleCustomBackup() {
    console.log("执行自定义备份操作");
    // 创建备份文件
    // 保存到备份目录
    // 记录备份信息
}

原始菜单事件

BeforeOriginalMenuCommand

语法

javascript
BeforeOriginalMenuCommand(menuTitle, IsCancel)

参数

名称必选/可选数据类型说明
menuTitle必选string菜单标题
IsCancel必选bool是否取消命令

说明

在用户执行文档菜单命令之前执行。 以下代码将显示用户点击的菜单命令,并取消所有操作(将CancelLastCommand属性设定为true则可以取消操作)。

示例代码

html
<object name='webwps' id='webwps_id' type='application/ntko-plug' 
        data='/opt/kingsoft/wps-office/office6/mui/default/templates/Normal.dotm' 
        width='1000' height='600' 
        ForBeforeOriginalMenuCommand='BeforeOriginalMenuCommand'>
</object>
javascript
// 原始菜单命令前事件处理
function BeforeOriginalMenuCommand(menuTitle, IsCancel) {
    console.log("原始菜单命令:", menuTitle);
    console.log("是否取消:", IsCancel);
    
    // 根据菜单标题处理不同操作
    switch(menuTitle) {
        case "新建":
            handleBeforeNew();
            break;
        case "打开":
            handleBeforeOpen();
            break;
        case "保存":
            handleBeforeSave();
            break;
        case "另存为":
            handleBeforeSaveAs();
            break;
        case "打印":
            handleBeforePrint();
            break;
        default:
            console.log("未知原始菜单命令:", menuTitle);
    }
    
    // 如果需要取消操作,设置IsCancel为true
    if (shouldCancelOperation(menuTitle)) {
        IsCancel = true;
        console.log("取消操作:", menuTitle);
    }
}

// 处理新建前操作
function handleBeforeNew() {
    console.log("新建文档前的处理");
    // 检查当前文档是否已保存
    // 提示用户保存
    // 执行新建操作
}

// 处理打开前操作
function handleBeforeOpen() {
    console.log("打开文档前的处理");
    // 检查当前文档状态
    // 验证文件权限
    // 执行打开操作
}

// 处理保存前操作
function handleBeforeSave() {
    console.log("保存文档前的处理");
    // 验证文档内容
    // 检查保存权限
    // 执行保存操作
}

// 处理另存为前操作
function handleBeforeSaveAs() {
    console.log("另存为前的处理");
    // 选择保存位置
    // 设置保存参数
    // 执行另存为操作
}

// 处理打印前操作
function handleBeforePrint() {
    console.log("打印前的处理");
    // 检查打印设置
    // 验证打印权限
    // 执行打印操作
}

// 判断是否应该取消操作
function shouldCancelOperation(menuTitle) {
    // 根据业务逻辑判断是否取消操作
    var restrictedOperations = ["删除", "清空", "重置"];
    return restrictedOperations.includes(menuTitle);
}

完整示例

菜单事件管理器

javascript
// 菜单事件管理器
class MenuEventManager {
    constructor() {
        this.menuHandlers = new Map();
        this.fileMenuHandlers = new Map();
        this.originalMenuHandlers = new Map();
    }
    
    // 注册自定义菜单处理器
    registerCustomMenuHandler(menuID, handler) {
        this.menuHandlers.set(menuID, handler);
    }
    
    // 注册文件菜单处理器
    registerFileMenuHandler(menuID, handler) {
        this.fileMenuHandlers.set(menuID, handler);
    }
    
    // 注册原始菜单处理器
    registerOriginalMenuHandler(menuTitle, handler) {
        this.originalMenuHandlers.set(menuTitle, handler);
    }
    
    // 处理自定义菜单命令
    handleCustomMenuCommand(menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID) {
        console.log("处理自定义菜单命令:", myMenuID);
        
        if (this.menuHandlers.has(myMenuID)) {
            const handler = this.menuHandlers.get(myMenuID);
            handler(menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID);
        } else {
            console.warn("未找到菜单处理器:", myMenuID);
        }
    }
    
    // 处理文件菜单命令
    handleFileMenuCommand(menuIndex, menuCaption, menuID) {
        console.log("处理文件菜单命令:", menuID);
        
        if (this.fileMenuHandlers.has(menuID)) {
            const handler = this.fileMenuHandlers.get(menuID);
            handler(menuIndex, menuCaption, menuID);
        } else {
            console.warn("未找到文件菜单处理器:", menuID);
        }
    }
    
    // 处理原始菜单命令
    handleOriginalMenuCommand(menuTitle, IsCancel) {
        console.log("处理原始菜单命令:", menuTitle);
        
        if (this.originalMenuHandlers.has(menuTitle)) {
            const handler = this.originalMenuHandlers.get(menuTitle);
            const shouldCancel = handler(menuTitle, IsCancel);
            return shouldCancel;
        }
        
        return false;
    }
}

// 创建菜单事件管理器实例
const menuEventManager = new MenuEventManager();

// 注册菜单处理器
menuEventManager.registerCustomMenuHandler(100, (menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID) => {
    console.log("执行新建文档操作");
    // 新建文档逻辑
});

menuEventManager.registerCustomMenuHandler(101, (menuPos, submenuPos, subsubmenuPos, menuCaption, myMenuID) => {
    console.log("执行打开文档操作");
    // 打开文档逻辑
});

menuEventManager.registerFileMenuHandler(300, (menuIndex, menuCaption, menuID) => {
    console.log("执行自定义保存操作");
    // 自定义保存逻辑
});

menuEventManager.registerOriginalMenuHandler("保存", (menuTitle, IsCancel) => {
    console.log("保存前的验证");
    // 验证逻辑
    return false; // 不取消操作
});

菜单权限控制

javascript
// 菜单权限控制
class MenuPermissionController {
    constructor() {
        this.permissions = new Map();
        this.userRole = 'user'; // 默认用户角色
    }
    
    // 设置用户角色
    setUserRole(role) {
        this.userRole = role;
        this.updateMenuPermissions();
    }
    
    // 更新菜单权限
    updateMenuPermissions() {
        switch(this.userRole) {
            case 'admin':
                this.setAdminPermissions();
                break;
            case 'editor':
                this.setEditorPermissions();
                break;
            case 'viewer':
                this.setViewerPermissions();
                break;
            default:
                this.setDefaultPermissions();
        }
    }
    
    // 设置管理员权限
    setAdminPermissions() {
        this.permissions.set('新建', true);
        this.permissions.set('打开', true);
        this.permissions.set('保存', true);
        this.permissions.set('另存为', true);
        this.permissions.set('打印', true);
        this.permissions.set('删除', true);
    }
    
    // 设置编辑者权限
    setEditorPermissions() {
        this.permissions.set('新建', true);
        this.permissions.set('打开', true);
        this.permissions.set('保存', true);
        this.permissions.set('另存为', true);
        this.permissions.set('打印', true);
        this.permissions.set('删除', false);
    }
    
    // 设置查看者权限
    setViewerPermissions() {
        this.permissions.set('新建', false);
        this.permissions.set('打开', true);
        this.permissions.set('保存', false);
        this.permissions.set('另存为', false);
        this.permissions.set('打印', true);
        this.permissions.set('删除', false);
    }
    
    // 设置默认权限
    setDefaultPermissions() {
        this.permissions.set('新建', false);
        this.permissions.set('打开', false);
        this.permissions.set('保存', false);
        this.permissions.set('另存为', false);
        this.permissions.set('打印', false);
        this.permissions.set('删除', false);
    }
    
    // 检查菜单权限
    hasPermission(menuTitle) {
        return this.permissions.get(menuTitle) || false;
    }
    
    // 处理菜单权限检查
    checkMenuPermission(menuTitle, IsCancel) {
        if (!this.hasPermission(menuTitle)) {
            console.log("用户无权限执行操作:", menuTitle);
            alert("您没有权限执行此操作");
            IsCancel = true;
            return true;
        }
        return false;
    }
}

// 创建权限控制器实例
const permissionController = new MenuPermissionController();

// 设置用户角色
permissionController.setUserRole('editor');

// 在原始菜单命令前检查权限
function BeforeOriginalMenuCommand(menuTitle, IsCancel) {
    if (permissionController.checkMenuPermission(menuTitle, IsCancel)) {
        return;
    }
    
    console.log("执行菜单命令:", menuTitle);
    // 执行菜单命令
}

注意事项

  1. 事件绑定

    • 确保在HTML中正确绑定事件处理函数
    • 事件函数名要与HTML中的属性值一致
    • 注意大小写和拼写
  2. 参数处理

    • 检查参数的有效性
    • 处理可选参数的情况
    • 注意参数的数据类型
  3. 菜单识别

    • 可以通过菜单ID或菜单标题识别
    • 建议使用菜单ID进行识别
    • 菜单标题可能因语言设置而变化
  4. 权限控制

    • 实现菜单权限控制
    • 根据用户角色显示/隐藏菜单
    • 处理权限不足的情况
  5. 错误处理

    • 处理菜单操作失败的情况
    • 提供用户友好的错误信息
    • 记录操作日志
  6. 性能优化

    • 避免在事件处理中执行耗时操作
    • 合理使用异步操作
    • 避免重复处理
  7. 用户体验

    • 提供及时的状态反馈
    • 显示操作进度
    • 处理用户交互
  8. 兼容性

    • 考虑不同浏览器的兼容性
    • 处理不同版本的差异
    • 测试各种场景