在dojo中具有丰富选项的列表框

时间:2012-05-27 11:22:45

标签: dojo listbox

我想知道是否有办法在dojo中获得一个列表框,哪个选项由图像和一段文本组成。列表应该是这样的:

列表框: - image / icon1 + text1 - image / icon2 + text2 ... - image / iconN + textN

我已经能够使用下拉列表来完成它,但它不是我需要的。我必须是列表框。

提前致谢。

2 个答案:

答案 0 :(得分:0)

您可以使用dojo CheckedMultiSelect。

<select name="someName" id="someId" multiple="true" data-dojotype="dojox.form.CheckedMultiSelect">
   <option id="someOptionId"><img src="images/aim-icon.gif" border=0>Blah Blah</option>
</select> 

答案 1 :(得分:0)

最后,我要做到这一点:

<html>
<head></head>
<body>
    <select id="list" size="3" style="width:100px;"></select>
    <input id="clear" type="button" value="Clear">
    <input id="populate" type="button" value="Populate">
    <script type="text/javascript" src="dojo.js"></script>
    <script>
        dojo.addOnLoad( function(){
            dojo.connect( dojo.byId("clear"), "onclick", this, clear );
            dojo.connect( dojo.byId("populate"), "onclick", this, populate);
        });
        dojo.addOnLoad( populate );

        function populate(){
            for(var i = 0; i < 10; i++ ){
                var html = i%2 ? '<img src="image1.png"> Item ' + i :
                                 '<img src="image2.png"> Item ' + i;
                dojo.create("option", {innerHTML: html, value: i }, 'list' );
            }
            dojo.byId('populate').disabled = true;
            dojo.byId('clear').disabled = false;
        }

        function clear(){
            var list = dojo.byId("list");
            var ops = list.options;
            while( ops.length ){
                ops.remove(0);              
            }
            dojo.byId('populate').disabled = false;
            dojo.byId('clear').disabled = true;
        }
    </script>
</body>
</html>

我希望它有所帮助!