jeditable change icon to textfield

I know how to use jeditable to change text to an textfield so I can changes my database. Now I have an email-icon on my page. The user should be able to double click it (when single click an mail is opened) and change the email address.

How should I do this?

    <td>'; if(!empty($row['email'])) { 
                echo '<a href="mailto:'.$row['email'].'" 
                      title="'.$lang['mail_verstuur'].'">
                     <img border="0" src="images/icon/mail.png"></a>'; 
             } echo '
     </td>

This is my javascript:

    <script type="text/javascript" charset="utf-8">
$(function() {

  $(".dblclick").editable("includes/js/save_to_db.php", { 
    开发者_Python百科  tooltip   : "Klik om te bewerken",
      event     : "dblclick",
      style  : "inherit"
  });
});
</script>

you can use jquery dblClick and click to capture the events you need to change the state.

e.g. give you icon an id say #mail

$('#mail').dblClick(function(){
//allow user to change value
});