我的漫漫程序之旅

专注于JavaWeb开发
随笔 - 39, 文章 - 310, 评论 - 411, 引用 - 0
数据加载中……

Ext Buttn and MessageBox 简单练习

 

<HTML>
 
<HEAD>
  
<TITLE> Ext Buttn and MessageBox 练习 </TITLE>
    
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
    
<script type="text/javascript" src="../../ext-all.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
    Ext.onReady(
function()
    
{
        
//构造一个普通Button
        new Ext.Button({
            text : '普通Alert',  
//按钮上的文本
            tooltip : '哈哈,成功了',
            type : 'button',   
//如果不指定默认就为button
            renderTo : 'd1',  //渲染到
            id : 'b1'

        }
);
        
//为按钮注册点击事件
        Ext.get('b1').on('click',function(e)
        
{
            Ext.Msg.alert('第一个按钮','您点击了第一个按钮
!');
        }
);
        
        

        
new Ext.Button({
            text : '构造alert',
            tooip : '提示',
            type : 'button',
            renderTo : 'd3',
            id : 'b2'
        }
);
        
        Ext.get('b2').on('click',
function(e)
        
{    
            
//构造自定义提示框
            Ext.Msg.show(
            
{
                title : '提示',
                msg : '您想保存修改吗
?',
                buttons : Ext.Msg.YESNOCANCEL,
                fn : processResult,
                animEl : 'elId',
                icon : Ext.MessageBox.QUESTION
            }
);
        }
);
        
        
//自定义提示框,处理事件
        function processResult(btn)
        
{
            
if(btn == 'yes')
                Ext.Msg.alert('提示','成功');
            
if(btn == 'no')
                Ext.Msg.alert('提示','失败');
            
if(btn == 'cancel')
                Ext.Msg.alert('提示','取消');
        }

        
        
new Ext.Button({
            text : '集点事件',
            tooip : '提示',
            type : 'button',
            renderTo : 'd4',
            id : 'b3'
        }
);

        Ext.get('b3').on('mouseover',
function(e)
        
{
            Ext.Msg.alert('提示','焦点事件');
        }
);    
        
//下拉按钮
        new Ext.SplitButton({
            renderTo : 'd2',
            text : '下拉按钮',
            handler : 
function()
            
{
                Ext.Msg.alert('提示','您点击了下拉按钮');
            }
,
            menu : 
new Ext.menu.Menu({
                items:
                [
                 
{text : '下拉按钮1' ,handler :function() //直接闭包
                     {
                        Ext.Msg.alert('下拉按钮1','您点击了下拉按钮1');
                     }

                 }
,
                 
{text : '下拉按钮2',handler : item2Handler //将处理函数写在外面
                 }

                ]
            }
)
        }
);
        
        
function item2Handler()
        
{
            Ext.Msg.prompt('输入','请输入您的姓名:',
function(btn,text)
            
{
                
if(btn == 'ok')
                
{
                    
if(text == '')
                    
{
                        Ext.Msg.alert('姓名提示','姓名不能为空');
                    }

                    
else
                    
{
                        Ext.Msg.alert('谢谢','
<font color=red>+ text + '</font>感谢您的注册');
                    }

                }

            }
);
        }


    }
);




//-->
</SCRIPT>
 
</HEAD>
 
<BODY>
 
<p>
   
<br />
   
<div id='d1'></div>
   
<div id='d2'></div>
    
<div id='d3'></div>
    
<div id='d4'></div>
 
</BODY>
</HTML>


posted on 2008-08-19 09:20 々上善若水々 阅读(1141) 评论(0)  编辑  收藏 所属分类: JavaScript


只有注册用户登录后才能发表评论。


网站导航: