ExtJS MessageBox相关

静态MessageBox，代码包含注释，不需要的方法先要注释掉

 稍微加点动态因素

 

 来个综合的示例

messagebox_all.html

 

	
		
		
		
		
		
		
		 
	
	
		
消息框综合演示
		

			Alert

			只有OK的确认框  
			演示
		
		

			Confirm

			带有YES||NO的选择框  
			演示
		
		

			Prompt

			带有文本输入的对话框  
			演示
		
		

			Show

			自定义对话框  
			演示
		
		

			Progress

			带有进度条的对话框（手动）  
			演示
		
		

			Progress_plus

			带有进度条的对话框（自动）  
			演示
		
		

			Icon

			带有图标的自定义按钮对话框（手动）  
			演示
		
	

   messagebox_all.js

 

Ext.onReady(function() {

	Ext.get('show_alert').on('click',function(e) {
		Ext.MessageBox.alert('演示','
点击了alert
',null);
	});

	Ext.get('show_confirm').on('click',function(e) {
		Ext.MessageBox.confirm('演示','
点击了confirm
',null);
	});

	Ext.get('show_prompt').on('click',function(e) {
		Ext.MessageBox.prompt('演示','
点击了prompt
',show_result,this,true,'请在此处输入');
	});	

	Ext.get('show_show').on('click',function(e) {
		Ext.MessageBox.show({
			title: '演示',
			msg: '
点击了show
', 
			modal:true,
			buttons: Ext.Msg.YESNOCANCEL,
			fn:function(id) {
				Ext.MessageBox.alert('结果','
' + id + '
',null);
			}
		});
	});

	Ext.get('show_progress').on('click',function(e) {
		 Ext.MessageBox.show({
           title: '演示',
           msg: '读取中，请等待...',
           progressText: '加载中...',
           width:300,
           progress:true,
           closable:false,
           animateTarget: 'show_progress'
       });

       var f = function(v){
            return function(){
                if(v == 12){
                    Ext.MessageBox.hide();
                    show_result('完成', '加载完成!');
                }else{
                    var i = v/11;
                    Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% completed');
                }
           };
       };
       for(var i = 1; i < 13; i++){
           setTimeout(f(i), i*500);
       }
	});

	Ext.get('show_progress_plus').on('click',function(e) {
		  Ext.MessageBox.show({
           title: '演示',
           msg: '读取中，请等待...',
           progressText: '加载中...',
           width:300,
           wait:true,
           waitConfig: {interval:200},
           iconHeight: 50,
           animateTarget: 'show_progress_plus'
       });
        setTimeout(function(){
            Ext.MessageBox.hide();
            show_result('完成', '加载完成!');
        }, 8000);
	});

	Ext.get('show_icon').on('click', function(){

        Ext.MessageBox.show({
           title: '对话框提示图标',
           msg: '注意左边的图标!',
           buttons: Ext.MessageBox.OK,
           buttonText:{
           		ok:'了解'
           },
           animateTarget: 'show_icon',
           icon: Ext.Msg.QUESTION, 
           fn:function(id) {
				Ext.MessageBox.alert('结果','
' + id + '
',null);
			}
       });
    });

	function show_result(id,msg) {
		Ext.MessageBox.alert('结果','
' + msg + '
',null);
	}
});