本文实例讲述了jQuery动态生成表格及右键菜单功能。分享给大家供大家参考，具体如下：
这里用的是 jquery 1.4.1 的库文件，具体代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
var id = 0;
function addInfo() {
var cpu = document.getElementById("txtCpu");
var zhuban = document.getElementById("txtZhuban");
var neicun = document.getElementById("txtNeicun");
var yingpan = document.getElementById("txtYingpan");
var tb = document.getElementById("tbAdd");
//alert("数据插入成功！");
var tr = tb.insertRow();
var td0 = tr.insertCell();
td0.innerHTML = id;
var td1 = tr.insertCell();
td1.innerHTML = cpu.value;
var td2 = tr.insertCell();
td2.innerHTML = zhuban.value;
var td3 = tr.insertCell();
td3.innerHTML = neicun.value;
var td4 = tr.insertCell();
td4.innerHTML = yingpan.value;
id++;
$("#tbAdd").append(tr);
}
$(function () {
var clickedTrIndex = -1;
$("#addForm>input[type=button]")
.live("click", function () {
$("#tbAdd tr:has(td):even").css("background", "#ebebeb");
});
//绑定鼠标移入移出事件到表格的行
$("#tbAdd tr:has(td)")
.live("mouseover", function () {
$(this).css("cursor", "pointer").css("background", "#bcc7d8");
})
.live("mouseleave", function () {
var trIndex = $(this).index();
if (trIndex % 2 == 0) {
$(this).css("background", "#ebebeb");
}
else {
$(this).css("background", "");
}
})
.live("mousedown", function (event) {
if (event.button == 2) {
x = event.clientX;
y = event.clientY;
$("#contextMenu").css("display", "block").css("left", x).css("top", y);
clickedTrIndex = $(this).index();
}
});
$("#contextMenu")
.mouseover(function () {
$(this).css("cursor", "pointer");
});
$("body")
.live("mouseup", function (event) {
if (event.button == 0) {
$("#contextMenu").css("display", "none");
}
});
$("#contextMenu li")
.mouseover(function () {
$(this).css("background", "#C1D7EE");
