本文共 1140 字，大约阅读时间需要 3 分钟。

我们可以轻松地通过右键单击创建一个漂亮的自定义菜单。

让我们创建一个div右键单击启用自定义菜单。

   
    Right Click here
   

要防止默认右键单击菜单，我们需要在head标记中添加以下代码：

$(document).ready(function () {$("#dv_rc").bind('contextmenu', function (e) {e.preventDefault(); // prevents default menu });});

现在，我们需要为右键菜单制作一个面板：

   
        
    
     Right Click Window
    
        
    
                          
     
                    
      Color                    
                      
     
                  
    
        
    
     
    
    
   

请注意style="display:none;"。这背后的原因是在右键单击之前不显示。

现在我们需要在右键单击显示它。

我们在之前添加的jquery中添加了一行代码，以修改CSS，使其显示并定位在单击的右下方。

$("#dv_rc").bind('contextmenu', function (e) {e.preventDefault(); // prevents native menu from being shown $("#popupRC").css({ position: "absolute", top: e.pageY, left: e.pageX, display: "block" });});

现在添加一些代码，点击close面板按钮关闭此窗口。

完整代码如下：

        
       
           
       	            
   
   
    
Right Click here 
   
    
   
       
   
    
   
        
    
     Right Click Window
    
        
    
                          
     
                    
      Color                    
                      
     
                  
    
        
    
     
    
    
   

原文地址：

转载地址：http://zyzhj.baihongyu.com/