Selected Row context menu appreared

I want to implement the context menu for the selected row. One time, one row can be selected and if user right click on it, context menu should be popped up. if user clicks other rows which are not selected, the context menu should not be popped up.

My code is given; Please give me an idea?

jQuery:

jQuery(document).bind("contextmenu", function(e) {
     jQuery('#myMenu').hide();
     return false;
     });

     jQuery('.even').bind("contextmenu", function(e) {    
         jQuery('#myMenu').css({        
             top: e.pageY+'px',        
                 left: e.pageX+'px'    
                 }).show();    
         return false;


     });

     jQuery('.odd').bind("contextmenu", function(e) {    
         jQuery('#myMenu').css({        
             top: e.pageY+'px',        
                 left: e.pageX+'px'    
                 }).show();    
         return false;


         });

Context Menu:

<ul id="myMenu" class="contextMenu">
      <li class="liReview"><a href="#liReview"><%include:SignforReview%></a></li>        
      <li class="liApprove"><a href="#liApprove"><%include:SignforApproval%></a></li>                    
      <li class="liRetReview"><a href="#liRetReview"><%include:RetractReviewSignature%></a></li>            
      <li class="liRetApprove"><a href="#liRetApprove"><%include:RetractReviewSignature%></a></li>            
</ul>

HTML -

<table> 
<tr id="line_<%=getData(ttEnl.line-num)%>" 
                        <%if:rowStyle(2)%&g开发者_如何学Ct;
                            class="even"
                            onmouseover="highlightLink(this,'even');" 
                            onmouseout="restore(this,'even');"
                            onclick="setSelected(this,'even');subjectSessionCheck('<%=getData(ttEnl.line-num)%>','<%=getData(ttEnl.rEnlRowid)%>','<%=getData(ttEnl.obj_enl)%>'); "
                        <%else:rowStyle%>
                            class="odd"
                            onmouseover="highlightLink(this,'odd');"
                            onmouseout="restore(this,'odd');"
                            onclick="setSelected(this,'odd');subjectSessionCheck('<%=getData(ttEnl.line-num)%>','<%=getData(ttEnl.rEnlRowid)%>','<%=getData(ttEnl.obj_enl)%>'); "
                        <%end:rowStyle%>
<td>.....</td>
<td>.....</td>
<td>.....</td>
</tr>
</table>

---

Your code is pretty much there. You are just missing a few things:

1. on your css class, you have to set the position: 'absolute'

2. when you render the selected row, you have add a class called rowselected to it. You can either do this by setting class="even rowselected" or by doing it with $(selector).addClass('rowselected')

3. you have to change your selector class to only select $('.even.rowselected, .odd.rowselected')

http://jsfiddle.net/rkw79/58dRL/