如何使用jquery ui将对话框定位到当前元素？

Question

Javascript代码：

currentElement=0;
$(function() {
    $( "#dialog" ).dialog({
        position: {
                my: "top",
                at: "bottom",
                of: $( 'input[name='+currentElement+']' )
            },
        autoOpen: false,      
              show: { effect: "blind", duration: 1000 },
              hide: { effect: "explode", duration: 400 }  
        });     
        $( 'input[name^=opener]' ).click(function() {
            currentElement=this.id;
            $( "#dialog" ).dialog( "open" );    
        });  
});  

HTML code：

<table border="1">
  <tr>
    <td>row 1, cell 1</td>
    <td>row 1, cell 2</td>
    <td><input type="button" name="opener1" id=1></td>
  </tr>
<tr>
  <td>row 2, cell 1</td>
  <td>row 2, cell 2</td>
  <td><input type="button" name="opener2" id=2></td>
</tr>
</table>

<div id="dialog" title="Basic dialog">  <p>This is an animated dialog which
 is useful for    displaying information. The dialog window can be moved, resized
 and closed with the 'x' icon.</p></div>

但它不起作用。更多 - 我无法关闭对话框。怎么解决？