Workaround For Clicks In A .Selectable()?

Workaround For Clicks In A .Selectable()?

Hello,

For a part of my website, I had to set a .selectable() on the <body> tag of the webpage and filter the elements. But now clicks wherever on the webpage are not registered as clicks. The .selectable() method of jQuery probably catch the click and does something with it ...

HTML:
  2. <body>
  3. <h2>Selectable table cells</h2>
  4. <table>
  5. <tr>
  6. <td>Cell1</td>
  7. <td>Cell2</td>
  8. <td>Cell3</td>
  9. <td>Cell4</td>
  10. </tr>
  11. <tr>
  12. <td>Cell5</td>
  13. <td>Cell6</td>
  14. <td>Cell7</td>
  15. <td>Cell8</td>
  16. </tr>
  17. </table>
  18. <br />
  19. <h3>If you <span>click here</span> an alert box should open.</h3>

  21. </body>
JAVASCRIPT:
  2. $(document).ready(function() {
  3.   
  4. $('span').live('click', function() {
  5. alert('hi there');
  6. });
  8. $('body').selectable({
  9. filter: "td"
  10. });
  11.   
  12. });

I have created a testpage so you can take a look: Testpage

The problem is that functions like .blur() doesn't work anymore, and I work with the jQuery plugin .editable where you submit the updated value of an input 'onblur'.

Is there a workaround? For example, do something with .mousedown() to trigger the submit?

Christophe