javascript - 如何进一步解耦这段 JavaScript 代码？

Question

我有一个 JavaScript 对象。你可以看到这条线：

window.gv.borderiseTDCell(this);

与窗口紧密耦合（如果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

Not sure why you'd need a library to outline a table cell. How about creating a class called outlinedCell

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

Then you can add, remove, or toggle this class

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

LIVE SAMPLE: http://jsfiddle.net/WJp2Z/

Answer 2

这可能是因为你在this应该使用的时候使用$(this)

borderiseTDCell($(this));

另外，gridview似乎没有定义：

var gridview = function (){}