Javascript w2ui-单击时工具栏更改按钮图像
我正在使用w2ui。我有一个带有一个按钮的工具栏。此按钮具有图标图像“图标删除” 当我点击按钮时,我希望它将图标图像更改为“图标添加”,但我的代码不起作用Javascript w2ui-单击时工具栏更改按钮图像,javascript,jquery,button,w2ui,Javascript,Jquery,Button,W2ui,我正在使用w2ui。我有一个带有一个按钮的工具栏。此按钮具有图标图像“图标删除” 当我点击按钮时,我希望它将图标图像更改为“图标添加”,但我的代码不起作用 工具栏:{ 项目:[{ 键入:“按钮”, id:'隐藏', 描述:“Menü”, img:'图标删除' }], onClick:函数(目标、数据){ 如果(目标==“隐藏”){ 此.items.img('icon-add'); } } } 我创建了一个带有“图标添加”图像的隐藏按钮“显示”。 单击“隐藏”按钮时,它将隐藏,而“显示”按钮将显示
工具栏:{
项目:[{
键入:“按钮”,
id:'隐藏',
描述:“Menü”,
img:'图标删除'
}],
onClick:函数(目标、数据){
如果(目标==“隐藏”){
此.items.img('icon-add');
}
}
}
我创建了一个带有“图标添加”图像的隐藏按钮“显示”。
单击“隐藏”按钮时,它将隐藏,而“显示”按钮将显示
toolbar: {
name: 'toolbar',
items: [
{ type: 'button', id: 'hide', caption: 'Menü', img: 'icon-delete' },
{ type: 'button', id: 'show', hidden: 'true', caption: 'Menü', img: 'icon-add' }
],
onClick: function (target, data) {
if (target == 'hide' ) {w2ui['layout'].toggle('left', window.instant);
this.hide('hide');
this.show('show');
}
if (target == 'show' ) {w2ui['layout'].toggle('left', window.instant);
this.hide('show');
this.show('hide');
}
}
}
可以使用toolbar.set()方法更新工具栏按钮图标。因此,在onClick事件中,请执行以下操作:
onClick: function (target, data) {
this.set(target, { icon: 'new_icon' });
}
请参阅此处的更多信息:我认为您在最初的方法中缺少了刷新行。这是一个对我有用的例子。我添加了另一部分
if (event.target == 'hide') {
if (this.items[0].icon == 'icon-delete') {
this.items[0].icon = 'icon-add';
//do something code
} else {
this.items[0].icon = 'icon-delete';
//do something else code
}
w2ui['toolbar'].refresh('hide');
}