Menu effect inside the table

Question

People, when right-clicking on the word menu a small menu opens. How do I make this happen inside the table’s (row) property?

   document.oncontextmenu = function() {return false;}; //não deixa abrir o menu ao clicar

 $('.menu_pai').mousedown(function(e){ 
    if( e.button == 2 ) { //verifica se é o botão direito
    	$(this).find('.menu').show();//mostra a div filha
    } 
  }); 
  $(document).mousedown(function(e) {
    if (e.button != 2) {
        $('.menu').hide();
    }
});

.menu{
  display: none;
}

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<table width="100%" border="1" >
    <tr>
        <td>ID:1</td>
        <td>Nome</td>
        <td>Idade</td>
    </tr>
   
</table>

<div class="menu_pai">
    Menu
    <div class="menu">
      link1 <br> link2
    </div>
</div>

Answer 1

I did it this way: I just changed your dial that was taking the document for $("tr") which takes any row from the table and added a ternary operator to test which button of mouse was clicked and perform the action!

//não deixa abrir o menu de contexto ao clicar com o botão direito
document.oncontextmenu = function() {return false;}; 

$("tr").mousedown(function(e) {
  $(".menu").html("Link " + (this.rowIndex+1) + "<br> Link " + (this.rowIndex+2));
  (e.button == 2) ? $(".menu").show() : $(".menu").hide();
});

 

.menu{
  display: none;
}

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<table width="100%" border="1" >
    <tr>
        <td>ID:1</td>
        <td>Nome</td>
        <td>Idade</td>
    </tr>
    <tr>
        <td>ID:2</td>
        <td>Nome</td>
        <td>Idade</td>
    </tr>
</table>

<div class="menu_pai">
    <div class="menu">
      
    </div>
</div>

Update

To answer this last question just add the following line in Jquery

$(".menu").html("Link " + (this.rowIndex+1) + "<br> Link " + (this.rowIndex+2));