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

发布于 2025-01-05 22:13:35 字数 1218 浏览 4 评论 0原文

我有一个 JavaScript 对象。您可以看到这一行：

window.gv.borderiseTDCell(this);

Is Tightthly Coupled to the window（如果 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>

原文

I have a JavaScript object. And you can see the line:

window.gv.borderiseTDCell(this);

Is tigthly coupled to the window (if gv is not initialised it crashes). However what I really want is to be able to do is:

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

    borderiseTDCell(this);
});

But that doesn't work. Any ideas what I can do? This is the full lisinng (with tight coupling):

gridview = function () {

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

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

};


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

       //dostuff to cell

    };

And a page...

<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>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

友欢 2025-01-12 22:13:35

这可能是因为您在应该使用 $(this) 时使用了 this

borderiseTDCell($(this));

另外， gridview 似乎没有定义：

var gridview = function (){}

It's probably because you're using this when you should be using $(this)

borderiseTDCell($(this));

Also, gridview doesn't seem to be defined:

var gridview = function (){}

回复收藏 0 原文

梦在夏天 2025-01-12 22:13:35

不确定为什么需要一个库来概述表格单元格。如何创建一个名为 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/

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/

回复收藏 0 原文

~没有更多了~