http://www.zhangxinxu.com/wordpress/?p=1667
1 <%@ page contentType="text/html; charset=UTF-8"%> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 6 <title>jQuerySmartMenuDemo</title> 7 <link rel="stylesheet" href="../component/alertifyjs/css/themes/bootstrap.min.css"> 8 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 9 <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Sans:400,700"> 10 <script type="text/javascript" src="../component/jquery-1.11.1.js"></script> 11 12 <script type="text/javascript" src="../component/jQuerySmartMenu/js/jquery-smartMenu.js"></script> 13 <link rel="stylesheet" href="../component/jQuerySmartMenu/css/smartMenu.css"> 14 <script type="text/javascript"> 15 $(function() { 16 $("#table tr").bind("mousedown", function (e) { 17 $.smartMenu.remove();//重新加载smartMenu，这很重要，不然会使用html的缓存 18 if (e.which == 3) { 19 var opertionn = { 20 name: "", 21 offsetX: 2, 22 offsetY: 2, 23 textLimit: 10, 24 beforeShow: $.noop, 25 afterShow: $.noop 26 }; 27 var oneObj = new Object; 28 oneObj.text = "标题"; 29 oneObj.func = function(){ 30 alert("我被点击了1"); 31 }; 32 var twoObj = new Object; 33 twoObj.text = "已读"; 34 twoObj.func = function(){ 35 alert("我被点击了2"); 36 }; 37 var imageMenuData = new Array(); 38 var imageMenuDataChild = new Array(); 39 imageMenuDataChild.push(oneObj); 40 imageMenuDataChild.push(twoObj); 41 imageMenuData.push(imageMenuDataChild); 42 $(this).smartMenu(imageMenuData,opertionn); 43 } 44 }); 45 }); 46 </script> 47 <style type="text/css"> 48 </style> 49 </head> 50 <body> 51 <table id="table" class="table table-striped table-bordered table-condensed"> 52 <tr> 53 <td>测试jQuerySmartMenu</td> 54 <td>测试jQuerySmartMenu</td> 55 <td>测试jQuerySmartMenu</td> 56 <td>测试jQuerySmartMenu</td> 57 <td>测试jQuerySmartMenu</td> 58 </tr> 59 <tr> 60 <td>测试jQuerySmartMenu</td> 61 <td>测试jQuerySmartMenu</td> 62 <td>测试jQuerySmartMenu</td> 63 <td>测试jQuerySmartMenu</td> 64 <td>测试jQuerySmartMenu</td> 65 </tr> 66 67 <tr> 68 <td>测试jQuerySmartMenu</td> 69 <td>测试jQuerySmartMenu</td> 70 <td>测试jQuerySmartMenu</td> 71 <td>测试jQuerySmartMenu</td> 72 <td>测试jQuerySmartMenu</td> 73 </tr> 74 75 <tr> 76 <td>测试jQuerySmartMenu</td> 77 <td>测试jQuerySmartMenu</td> 78 <td>测试jQuerySmartMenu</td> 79 <td>测试jQuerySmartMenu</td> 80 <td>测试jQuerySmartMenu</td> 81 </tr> 82 83 </table> 84 85 </body> 86 </html>