基于JavaScript实现智能右键菜单

在现代网页开发中，智能右键菜单已经成为提升用户体验的重要一环。今天，我将为大家详细介绍如何使用JavaScript实现这一功能，并分享相关代码和资料。

```javascript

var cityArray = ['北京', '上海']; // 城市数组

// 设置表头的鼠标右击事件

$('th').mousedown(function(e){

var selected = e.targetnerHTML;

// 3表示右键

if(e.which == 3){ // 判断是否为右键点击事件

if(selected == "订票类型"){ // 如果是订票类型表头，显示相关菜单项

var opertion = { name: "订票类型" }; // 定义菜单名称

var data = [ / 定义菜单项数据 / ]; // 这里可以根据实际需求定义菜单项的数据和函数

$(this).smartMenu(data, opertion); // 显示智能菜单

} else if(selected == "出发城市"){ // 如果是出发城市表头，显示城市列表菜单项

var opertion = { name: "出发城市" }; // 定义菜单名称

var data = []; // 初始化菜单数据数组

for(var i=0; i

// 使用闭包确保函数内i值正确获取城市名称

(function(i){

func = function(){

alert(cityArray[i]);

}

})(i);

var obj = { text: cityArray[i], func: func }; // 创建菜单项对象并添加到数组中

data.push([obj]); // 将数组添加到菜单数据中

}

var other = { text: "全部", func: function(){ alert("全部"); } }; // 添加其他选项到菜单中

data.push([other]); // 将其他选项数组添加到菜单数据中

$(this).smartMenu(data, opertion); // 显示智能菜单在出发城市列头中

}

return false; // 阻止链接跳转等默认行为的发生

}

});

```