以编程方式在dojo中添加和删除图标

时间:2013-02-06 13:56:56

标签: dojo

我想在LI中的ListItem类型上添加Icon,如何在运行时以编程方式添加它。

<ul data-dojo-type="dojox.mobile.RoundRectList" class="resultList">
    <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='moveTo:"addAPatientView", icon: "mblDomButtonDarkBlueCheck"'>
        <div class="ListItemTitle">Patient</div>
        <div class="ListItemSubTitle">Complete the new patient profile</div>
    </li>
</ul>


require(["dojo/ready","dojox/mobile/parser",
"dojox/mobile/Icon"], function (ready, Icon) {
});;

代码编写为JSfiddle,可能无法在JSfiddle中显示图标。

1 个答案:

答案 0 :(得分:1)

我分叉并更新你的小提琴。在你的小提琴中,你没有解析小部件。

文档使用样式表,因此我添加了样式表。你正在使用的图标css类不在那个css中,所以我改了它。

http://dojotoolkit.org/reference-guide/1.8/dojox/mobile/ListItem.html

我还演示了如何以编程方式更改图标。

http://jsfiddle.net/cswing/L7Pwt/

require(["dojo/ready","dijit/registry","dojox/mobile/parser", 
  "dojox/mobile/Icon", "dojox/mobile/RoundRectList", "dojox/mobile/ListItem"], 
function (ready, registry, parser, Icon) {

    ready(100, function(){
        parser.parse();

        // change the icon programatically in 5 seconds
        setTimeout(function(){
            var li = registry.byId("listItem");
            li.set('icon', 'mblDomButtonRedCircleMinus');
        }, 5000);
    });        
});