ext如何实现换肤,项目中急用请各位大哥帮帮忙?

解决方案 »

  1.   

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title></title>
    <link rel="Stylesheet" type="text/css" href="ext-2.3.0/resources/css/ext-all.css" />
    <link rel="stylesheet" type="text/css" />
    <script type="text/ecmascript" src="ext-2.3.0/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="ext-2.3.0/ext-all.js"></script>
    </head>
    <body>
    <script language="javascript" type="text/javascript">
    Ext.onReady(function(){
        var themes=
        [
            ['default','默认'],
            ['gray','银灰'],
            ['orange','橘黄'],
            ['purple','紫色'],
            ['red5','red5'],
            ['silverCherry','silverCherry'],
            ['slate','slate']
        ]
        var cb=new Ext.form.ComboBox({
            id:"cb",
            store:themes,
            width:80,
            typeAhead:true,
            triggerAction:'all',
            emptyText:'界面主题',
            selectOnFocus:true
        });
        cb.on({
            "select":function(field,newValue,oldValue)
                {
                    var css=newValue.data.value;
                    document.getElementsByTagName("link")[1].href="ext-2.3.0/resources/css/xtheme-"+css+".css";
                }
        });
        var win=new Ext.Window({
            title:"更换皮肤",
            renderTo:Ext.getBody(),
            width:500,
            height:300,
            bbar:[
                '选择皮肤','',cb
            ]
        });
        win.show();
    })
    </script>
    </body>
    </html>