javascript - Infinite new window loop when triggering click event -

i have overview page shows data in table. pop-up opens when user clicks on row. pop-up get's reloaded on , on again until hangs.

the overview code:

<tbody>     <tr>        <td>           <a href="/pop-up/details/1/" onclick="mywindow=window.open('/details_screen/1/','window1','toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=800,height=600'); return false;">details screen 1</a>        </td>     </tr>     <tr>        <td>           <a href="/pop-up/details/2/" onclick="mywindow=window.open('/details_screen/2/','window2','toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=800,height=600'); return false;">details screen 2</a>        </td>     </tr> </tbody> 

the javascriptthat makes rows clickable:

function make_rows_clickable(table){     $(table).find('tbody tr').each(function() {                 $(this).hover(function(){                     //rollover                     $(this).addclass('hover');                 },                 function() {                     //rolloff                     $(this).removeclass('hover');                 }).click(function() {                     $(this).find('a').click();                 });     }); } 

solution

as answer comment states, anchor click triggers tr click event , creates infinte loop. solved removing onclick event , adding attributes. tr click event opens pop-up.

<td>     <a href="/pop-up/details/2/"element_id="2" pop_w="800" pop_h="600">details screen 2</a> </td> 

js:

$(table).find('tbody tr').hover(function(){                     //rollover                     $(this).addclass('hover');                 },                 function() {                     //rolloff                     $(this).removeclass('hover');                 }).click(function(e) {                     e.stoppropagation();                     var anchor = $(this).find('a');                      var el_id = $(anchor).attr('element_id');                     var pop_w = $(anchor).attr('pop_w');                     var pop_h = $(anchor).attr('pop_h');                      mywindow=window.open('/details/screen/' + el_id + '/', el_id, 'toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=' + pop_w + ',height=' + pop_h); }); 

so there must multiple td's in each table rows. therefore when run

$(this).find('a').click(); 

it finds every a tag in row (equal number of td's) in row , executes click functions. due opens multiple popups

replace code with:

$(this).find('a:first').click(); 

or use:

$(table).find('tbody tr').click(function() {    mywindow = window.open('/details_screen/2/', 'window2', 'toolbar=no, location=no, directories=no, status=yes, menubar=no, scrollbars=yes, resizable=yes, width=800, height=600');    return false; })