我有一个按钮,我希望能够单击该按钮并将图像更改为其他内容,听起来很简单。
<buttonLockup toggle="true">
<badge src="resource://button-rate-off" class="whiteButton" />
<title>Add to Favourites</title>
</buttonLockup>
应更改为:
<buttonLockup toggle="true">
<badge src="resource://button-rate-on" class="redButton" />
<title>Remove from Favourites</title>
</buttonLockup>
在我的演示器中.js我有一个加载函数,可以检测我已选择的项目:
load: function(event) {
console.log(event);
var self = this;
var ele = event.target;
var toggle = ele.getAttribute("toggle");
if (toggle)
{
console.log(ele);
var badge = ele.getElementsByTagName("badge").item(0);
console.log(badge);
badge.src = "resource://button-rated"; // Doesn't change
}
},
关于如何改变它的任何想法?
好的
,所以这似乎有效,但我遇到了上述部分的奇怪重新布局问题:
var isTrueSet = (toggle === 'true');
var badge = ele.getElementsByTagName("badge").item(0);
if (isTrueSet == true)
{
badge.setAttribute('src', 'resource://button-rated');
} else {
badge.setAttribute('src', 'resource://button-rate');
}
ele.setAttribute('toggle', !isTrueSet);