右键菜单点击删除：
<style>
#menu:hover {
border: 1px solid #0a246a;
background: #b6bdd2;
}
#menu{
border:1px solid #0a246a;
padding:2px;
background-color:#e8e8e8;
}
</style>
<html>
<body>
<table>
<tr><td>
<select id="test" multiple="true" οnmοuseup="listener(event,'test')">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td></tr>
</table>
<span id="menu" style="display:none;position:absolute" οnclick="delItem()">
<img id="del" src="del.png"/>删除
<input id="delOption" type="hidden"/>
</span>
</body>
</html>
<script language="javascript" type="text/javascript">
function listener(oEvent,obj){
if (!oEvent) oEvent=window.event;//IE
if (oEvent.button==2){//2表示右键
//获取鼠标点击位置：firefox用pageX,pageY;IE用x,y
//设置位置时firefox不加单位无效，IE兼容，所有在变量末尾最好加上"px"
var x = oEvent.x ? oEvent.x : oEvent.pageX;
var y = oEvent.y ? oEvent.y : oEvent.pageY;
document.getElementById("menu").style.left =document.body.scrollLeft+x+10+'px';
document.getElementById("menu").style.top = document.body.scrollTop+y+10+'px';
document.getElementById("menu").style.display = "inline";
document.getElementById("delOption").value = obj;
}
}
document.getElementById("test").οncοntextmenu=function(event) {
if (document.all) window.event.returnValue = false;//IE
else event.preventDefault();//Firefox
};
function delItem(){
menu.style.display="none";
if(confirm("是否确认删除？")){
//获取操作内容
var param = document.getElementById("delOption").value;
var parameter = document.getElementById(param);
}else{
return;
}
}
</script>遇到的问题：
1、Firefox、IE、Chrome兼容性问题，及javascript在浏览器之间的区别：
2、oncontextmenu()使用时的注意项
3、鼠标事件的内置对象event
参考：右键菜单：javascript:mctmp(0);
Javascript在Firefox、IE的区别：javascript:mctmp(0);
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
