XPages - 更改位置栏按钮的背景颜色
Posted
技术标签:
【中文标题】XPages - 更改位置栏按钮的背景颜色【英文标题】:XPages - change background color of place bar button 【发布时间】:2013-09-04 15:09:05 【问题描述】:我想在单击按钮时更改位置栏按钮的背景颜色。我怎样才能做到这一点?我考虑过使用 Dojo 或 javascript,但我不知道如何获得位置栏按钮的“id”。
【问题讨论】:
我认为这更像是一个 OneUI 问题。添加了 oneui 标签。 【参考方案1】:“另一种解决方案,例如绿色的 Steve Zavocki。” 此代码不使用 jQuery,因此您不必在应用程序中集成 jQuery.js,您可以使用本机 javascript 和 dojo 来执行此操作,它已经集成在 XPages 中,因此您没有太多开销。
还有其他方法可以使用 javascrip 获取元素:
document.getElementById
dcoument.getElementsBy ClassName, Name, TagName, TagNameNs
dojo 或 Steve 在他的 jQuery 代码中使用的那样:
<xp:button value="ChangeColor" id="button1">
<xp:eventHandler event="onclick" submit="false">
<xp:this.script><![CDATA[var placebar = document.getElementsByClassName("lotusPlaceBar")[0]; //place bar should be unique
placebar.style.backgroundColor = "green";
placebar.style.backgroundImage = "none";
//.. more styling;]]></xp:this.script>
</xp:eventHandler>
</xp:button>
【讨论】:
谢谢,我真正需要的是行 var placebar = document.getElementsByClassName("lotusPlaceBar")[0]。一旦我掌握了位置栏按钮的句柄,我就使用 dojo.addClass 添加了一个我自己创建的新样式类。【参考方案2】:托尼,
您可以编写简单的 jQuery 来更改颜色。不要使用 id,而是添加一个类并让 jQuery 操作它。 Marky Roden 最近写了一篇很棒的文章。
http://xomino.com/2013/08/26/decoupling-your-css-from-your-javascript-a-well-no-duh-moment/
要将类添加到按钮,请转到所有属性下,然后找到 attrs,按加号,它将创建一个属性。给它一个“类”的名称,以及你想要调用它的任何值。类不是唯一的,因此您可以通过使用相同的类使所有按钮具有相同的行为。
如果你给它一个“js-foo”类,那么你的代码应该是这样的:
$(".js-foo").click(function()
$( this ).css( "background-color" : "red");
);
(我还没有实际测试过,但这应该接近你想要的)
【讨论】:
谢谢,我更喜欢使用 Dojo,因为它已经内置在 XPages 中以上是关于XPages - 更改位置栏按钮的背景颜色的主要内容,如果未能解决你的问题,请参考以下文章
更改导航栏背景颜色后,self.view 的 y 位置发生更改