如何進一步解耦此JavaScript代碼？

Question

我有一個JavaScript對象。你可以看到行：

window.gv.borderiseTDCell(this); 

是tigthly耦合到窗口（如果gv將不會被初始化它崩潰）。然而我真正想要的是能夠做到的是：

//bind the click event 
jQuery('.highlightableTDCell').click(function() { 

    borderiseTDCell(this); 
}); 

但這並不奏效。任何想法我可以做什麼？這是一個完整lisinng（與緊耦合）：

gridview = function() { 

    //bind the click event 
    jQuery('.highlightableTDCell').click(function() { 

     window.gv.borderiseTDCell(this); 
    }); 

}; 


//selecting cell 
gridview.prototype.selectCell = function (obj) { 

     //dostuff to cell 

    }; 

和頁面...

<table class="EditTable" cellpadding="0" cellspacing="0">  
     <tr> 
      <td> 
       <div style="">0</div> 
      </td> 
      <td> 
       <div style="">0 akudsfsa fdhsad fiasgdf swae</div> 
      </td> 
      <td class="highlightableTDCell"> 
       <div> 
        <input value="0.00"/> 
       </div> 
      </td> 
     </tr> 
</table> 

Answer 1

這可能是因爲你使用this時，你應該使用$(this)

borderiseTDCell($(this)); 

另外，gridview似乎沒有定義：

var gridview = function(){} 

Answer 2

不確定爲什麼你需要一個庫來勾畫表格單元格。如何創建一個名爲outlinedCell

.outlinedCell{border:1px solid #f00;} 

然後你就可以添加，刪除或切換該類

//bind the click event 
$('.highlightableTDCell').click(function() { 
    $(this).addClass('outlinedCell'); 
    // or // $(this).removeClass('outlinedCell'); 
    // or // $(this).toggleClass('outlinedCell'); 
}); 

LIVE樣品等級：http://jsfiddle.net/WJp2Z/