0

我有一个包含 Navigator 控件的 XPage。导航器有 3 个导航项，每个导航项都是一个基本节点。基本节点的 onClick 事件执行一些客户端 javascript。我想在单击导航项时更改它的背景颜色。我已经尝试使用 javascript 和 dojo 执行此操作，但无法处理导航项基本节点。我可以使用什么代码来获取导航项基本节点，以便我可以使用 CSS 更改它的外观？使用 Dojo 我尝试过

dojo.query(".lotusMenuHeader ul :nth-child(1)")

感谢 Michael Saiz，我现在有了一个解决方案。我想要做的是在使用客户端 JavaScript 单击它时将“lotusSelected”类添加到导航器项目（并从其他项目中删除该类）。我的导航器只有三个项目，所以这是我现在用来让它工作的代码：

var comp = this;
var par = comp.parentNode; // li tag
par.id = "parID";
var par2 = par.parentNode; // ul tag
par2.id = "ul_node;"
var eigene = par2.childNodes[1];
eigene.id = "eigene";
var alle = par2.childNodes[3];
alle.id = "alle";
var abgeschlossen = par2.childNodes[5];
abgeschlossen.id = "abgeschlossen";

dojo.removeClass("alle","lotusSelected");
dojo.removeClass("abgeschlossen","lotusSelected");
dojo.addClass("eigene","lotusSelected")
4

2 回答 2

1

我在使用 Navigator 中的 onClick 事件时发现了一个不错的技巧。您可以使用它来处理 Item 本身。然后设置一个 id 或对项目进行一些直接修改，而无需查询整个页面或 css 类：

  <xe:basicLeafNode label="Link 1">
        <xe:this.onClick><![CDATA[var comp = this;
    this.id = "item1"; // example
    window.alert(this.id);
    //call a function form a script lib. like changeColor(this,color);
    this.style.backgroundColor = "blue";]]></xe:this.onClick>
    </xe:basicLeafNode>

对于 MouseOver 效果，您可以使用 hover: css 来更改项目的颜色，例如：我使用它在我的视图中获取 MouseOver efekt：

.xspHtmlProdView:hover{background-color:#ffffc8;}

对于导航项目，我认为您将需要menuitem:hover {}或类似lotusMenuHeader > li {}

于 2013-09-06T05:32:46.613 回答
1

您想要查找.lotusTitleBar ul.lotusTabs div a（在 R9/OneUIv3 中它看起来像.lotusTitleBar2 .lotusNavTabs div a然后使用dojo.connect将事件附加到它们。Dojo connect 将使用它连接到的元素触发。所以您不需要查看索引。

让我们知道怎么回事

于 2013-09-06T03:18:33.443 回答