EasyUI Dialog控件

代碼Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Dialog</title>
    
    <script src="../jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="../jquery.easyui.min.js" type="text/javascript"></script>

    <link href="../themes/default/easyui.css" rel="stylesheet" type="text/css" />
    <link href="../themes/icon.css" rel="stylesheet" type="text/css" />
    
    <script>
        $(function(){
            $('#dd').dialog({
                toolbar:[{
                    text:'添加',
                    iconCls:'icon-add',
                    handler:function(){
                    alert('添加數據')
                    }
                },'-',{
                    text:'保存',
                    iconCls:'icon-save',
                    handler:function(){
                        alert('保存數據')
                    }
                }],
                buttons:[{
                    text:'提交',
                    iconCls:'icon-ok',
                    handler:function(){
                    alert('提交數據');
                    }
                },{
                    text:'取消',
                    handler:function(){
                    $('#dd').dialog('取消');
                    }
                }]
            });
        });
        
    </script>
</head>
<body>
    <div id="dd" style="padding:5px;width:400px;height:200px;">
        <p>jQuery EasyUI---Dialog</p>
    </div>
</body>
</html>

效果



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章