Question

有没有办法在programmatic中为dijit.form.button添加img src标签？

在声明中，我们可以这样做：

<div dojoType="dijit.form.Button"><img src="images/img.png"/></div>

在这种情况下，dijit按钮完全被图像替换。

如果我尝试这样的事情，图像不会替换按钮，但会出现在：

var button = new dijit.form.Button({
        showLabel : false,
        label : "Validate",
        iconClass : "alphaIcon validateIcon",   
    })

非常感谢您的帮助。

提前致谢

Answer 1

我认为你的方法应该是完成你所做的并创建自定义css来修改外观。

myIconButton.dijitButton .dijitButtonNode {
  border: 0;
  background-image: none;
  background-color: transparent;
  box-shadow: none;
}

var button = ... // same as above
dojo.addClass(button.domNode, 'myIconButton');

要直接回答您的问题，您可以使用仅包含图像源的自定义模板创建自己的按钮小部件。

dojo.declare("MyIconButton", [Button], {
  templateString: '<div><img src="${imageSrc}"></img></div>'
});

注意：我没有测试这种方法，并且在MyIconButton中可能需要进行其他修改，因为基本Button类需要模板中的其他节点。

Answer 2

以下将执行您想要的操作

this.button1.attr('label','<img src="' + this.constants.packagePrefix + '/images/button1.gif"/>');

我在这里找到了： http://mail.dojotoolkit.org/pipermail/dojo-interest/2009-August/038353.html

Answer 3

我一直在使用带背景图像的班级按钮。这个真的使得动态设置图像变得困难。所以，我成功地使用了这个：

domStyle.set(myButton.iconNode, 'background-image', 'url(images/icon.png)');

诀窍是使用iconNode，而不是domNode或containerNode。

在程序化中使用img src的dijit.form.button

3 个答案: