当前位置：文江博客话题详情

在 XUL 中捕获可编辑的树更改

发布于 2024-11-09 14:56:10 字数 205 浏览 6 评论 0原文

我有一个动态构建的可编辑 XUL 树。问题是——如何监听和捕捉变化的单元格？

我通过捕获tree.inputField的blur事件来检测编辑值的提交，任何其他事件都不起作用。至少它是有效的，但是有没有一种简单的方法来检索新的价值呢？

它真的应该像获取 Tree 元素、计算当前单元格并查询其新值一样黑客吗？

原文

分享到QQ

分享到微博

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

发布评论

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

绝對不後悔。 2024-11-16 14:56:10

我猜想“动态构造”意味着您为树项动态生成 DOM 元素。然后，您应该能够在标记上注册 DOMAttrModified 事件处理程序，并侦听树的 label 属性的更改细胞。

然而，通常的方法是让树完全动态。您需要一个实现 nsITreeView 的对象（请参阅 https://developer.mozilla.org/ En/NsITreeView）。您将该对象分配给 tree.view 属性。该对象定义了树有多少行、在哪个单元格中显示什么内容、行/列/单元格应具有哪些属性，所有这些都无需在内包含任何 DOM 节点。不幸的是，它是一个实现起来很复杂的接口，特别是因为树的分层性质。然而，如果你有一个简单的列表，许多方法就会变得微不足道。

有两种方法特别有趣。 isEditable() 允许您确定特定的树单元是否应该可编辑。每当单元格被编辑时，setCellText()就会被调用。

如果您不想重新实现 nsITreeView，也可以包装默认视图。像这样的东西：

var oldView = tree.view;
var newView = {
    __proto__: oldView,
    setCellText(row, col, value)
    {
        oldView.setCellText(row, col, value);
        alert("Text changed for a tree cell!");
    }
};
tree.view = newView;

I guess that "dynamically constructed" means that you dynamically generate DOM elements for the tree items. Then you should be able to register a DOMAttrModified event handler on the <treechildren> tag and listen to changes of the label attribute of the tree cells.

However, the usual approach is to have the tree entirely dynamic. You need an object implementing nsITreeView (see https://developer.mozilla.org/En/NsITreeView). You assign that object to the tree.view property. And that object defines how many rows your tree has, what to display in which cell, what properties a row/column/cell should have, all without having any DOM nodes inside <treechildren>. Unfortunately, it is a complicated interface to implement, especially because of the hierarchical nature of the trees. If you have a plain list many methods become trivial however.

Two methods are particularly interesting. isEditable() allows you to determine whether a particular tree cell should be editable. And setCellText() is called whenever a cell has been edited.

If you don't want to reimplement nsITreeView, wrapping the default view should also be possible. Something like this:

var oldView = tree.view;
var newView = {
    __proto__: oldView,
    setCellText(row, col, value)
    {
        oldView.setCellText(row, col, value);
        alert("Text changed for a tree cell!");
    }
};
tree.view = newView;

回复收藏 0 原文

~没有更多了~