如何进一步解耦此JavaScript代码

How can I decouple this JavaScript code further?

本文关键字：JavaScript 代码 解耦 进一步      更新时间：2023-09-26

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

window.gv.borderiseTDCell(this);

与窗口紧密耦合（如果未初始化gv，则会崩溃）。然而，我真正想做的是：

//bind the click event
jQuery('.highlightableTDCell').click(function () {
    borderiseTDCell(this);
});

但这行不通。你知道我能做什么吗？这是完整的提示（具有紧密耦合）：

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>

这可能是因为在应该使用$(this) 的情况下使用this

borderiseTDCell($(this));

此外，gridview似乎没有定义：

var gridview = function (){}

不确定为什么需要一个库来勾勒表单元格的轮廓。创建一个名为outlinedCell 的类怎么样

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

然后您可以添加、删除或切换此类

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

现场样本：http://jsfiddle.net/WJp2Z/

相关文章：