• Ext.MessageBox的用法


    1.Ext.MessageBox.alert()方法 
    有四个参数:alert( title , msg , function(){} ,this) 
    其中title,msg为必选参数,function为可选参数,在关闭弹出窗口后触发,可以传入点击的按钮的id,第四个参数scope:指回调函数作用域。 

    Ext.Msg.alert("Notice","hello world!");  //alert会阻塞程序的执行,而Ext版的alert是异步执行 
    Ext.Msg.alert(“Notice”,”<font color=red>hello world!</font>”); //支持html格式 
    Ext.Msg.alert(“Notice”,”<font color=red>hello world!</font>”,function callback(id){alert(‘您点的是’+id);}); 

    2.Ext.MessageBox.confirm()方法 

    基本上同alert()方法一模一样。 注意这点: 

    Ext.MessageBox.confirm(“title“,“msg“,function(e){alert(e);}); 
    这个参数e是什么?它是你点击的弹出框的按钮的值,三种值:yes,no,cancel. Alert()方法也是如此,不过只有两种值:ok,cancel. 

    回调函数可以传入一唯一参数:单击按钮的id,点击退出按钮也会触发此事件 

    3.Ext.MessageBox.prompt()方法 
    有五个参数,比前面alert方法多一个是否多行。 

    Ext.MessageBox.prompt(“title“,"msg"); 
    Ext.Msg.prompt(‘Notice’,'请输入你的姓名:’,function callback(id,msg){alert(‘单击的按钮ID:’+id+’ 您输入的姓名是:’+msg);},this,false); 
    //输入”javachen”,点击ok按钮,弹出单击的按钮ID:OK 您输入的姓名是:javachen 
    Ext.MessageBox.prompt(“title“,“msg“,function(e,text){alert(e+“-“+text);},this,true);//true为多行,this表示作用域 
    4.Ext.MessageBox.show()方法 
    功能很强大,采用config配置形式,比前面的方法使用更方便。 参数很多,在此列举最常用的配置参数: 

    1.animEl:对话框弹出和关闭时的动画效果,比如设置为“id1”,则从id1处弹出并产生动画,收缩则相反 
    2.buttons:弹出框按钮的设置,主要有以下几种:Ext.Msg.OK, 
    Ext.Msg.OKCANCEL, 
    Ext.Msg.CANCEL, 
    Ext.Msg.YESNO, 
    Ext.Msg.YESNOCANCEL 
    你也可以自定义按钮上面的字:{“ok“,“我本来是ok的“}。 若设为false,则不显示任何按钮. 
    3.closable:如果为false,则不显示右上角的小叉叉,默认为true。 
    4.msg:“消息的内容“ 
    5.title:“标题“ 
    6.fn:关闭弹出框后执行的函数 
    7.icon:弹出框内容前面的图标,取值为Ext.MessageBox.INFO, 
    Ext.MessageBox.ERROR, 
    Ext.MessageBox.WARNING, 
    Ext.MessageBox.QUESTION 
    8.弹出框的宽度,不带单位 
    9.prompt:设为true,则弹出框带有输入框 
    10.multiline:设为true,则弹出框带有多行输入框 
    11.progress:设为true,显示进度条,(但是是死的) 
    12.progressText:显示在进度条上的字 
    13.wait:设为true,动态显示progress 
    14.waitConfig:配置参数,以控制显示progress 
    例子: 
    Ext.Msg.show({ 
    title:’Notice’, 
    msg:’请输入您的姓名!’, 
    300, 
    prompt:true, 
    //multiline:true, 
    //wait:true, 
    //progress:true, 
    //progressText:’progressing’, 
    closable:true, 
    modal:true, 

    buttons:Ext.Msg.OKCANCEL, 
    icon:Ext.Msg.INFO 
    }); 



    5.Ext.MessageBox.wait() 
    参数 msg:显示信息  title:标题      config:配置信息 
    例子: 
    Ext.Msg.wait(‘请等待,操作正在进行中’,'Notice’); 
    Ext.Msg.wait(‘请等待,操作正在进行中!’,'Notice’, 
    { 
    text:’processing’, 
    duration:2700,   //进度条在被重置前运行的时间 
    interval:300,        //进度条的时间间隔 
    increment:10,      //进度条的分段数量 
    fn:function callback(){ 
    alert(“complete”); 
    } 
    }); 
    6.Ext.MessageBox.hide() 
    把显示着的当前message box隐藏起来。 
    参数: 无.       Returns:   Ext.MessageBox 
    7.Ext.MessageBox.updateProgress() 
    Ext.MessageBox.updateProgress(value,”ProgressText”,”msg”)  //(三个参数,看名字就知道意思), 注意value为0-1之间的数,表示进度条的进度. 


    8.修改默认的按钮文字为中文 
    Ext.Msg.buttonText={ 
    yes:' yes', 
    no:'否', 
    ok:'确定', 
    cancel:'取消' 
    }; 
    Ext.Msg.buttonText.yes='是'; 
    9.动态跟新提示框 
    1)跟新提示文字 
    var msgBox = Ext.MessageBox.show({ 
    title:’提示’, 
    msg:’动态跟新的信息文字’, 
    modal:true, 
    buttons:Ext.Msg.OK 
    }) 
    //Ext.TaskMgr是一个功能类,用来定时执行程序, 
    //在这里我们使用它来定时触发提示信息的更新。 
    Ext.TaskMgr.start({ 
    run:function(){ 
    msgBox.updateText(‘会动的时间:’+new Date().format(‘Y-m-d g:i:s A’)); 
    }, 
    interval:1000 
    }); 
    2).跟新进度条及提示信息 
    var msgBox = Ext.MessageBox.show({ 
    title:’提示’, 
    msg:’动态跟新的进度条和信息文字’, 
    modal:true, 
    300, 
    progress:true 
    }) 

    var count = 0;//滚动条被刷新的次数 
    var percentage = 0;//进度百分比 
    var progressText = ”;//进度条信息 

    Ext.TaskMgr.start({ 
    run:function(){ 
    count++;   //刷新10次后关闭信息提示对话框 
    if(count > 10){ 
    msgBox.hide(); 
    } 
    //计算进度 
    percentage = count/10; 
    //生成进度条文字 
    progressText = ‘当前完成度:’+percentage*100 + “%”; 
    //更新信息提示对话框 
    msgBox.updateProgress(percentage,progressText, 
    ‘当前时间:’+new Date().format(‘Y-m-d g:i:s A’)); 

    }, 
    interval:1000 
    }); 

    一、提示框(Ext.MessageBox.alert  或  Ext.Msg.alert)

    alertString title, String msg, [Function fn], [Object scope] ) :

    title:标题

    msg:显示内容

    fn:回调函数

    scope:作用域

    Js代码

    <script type="text/javascript">

            Ext.onReady( function(){

                       Ext.MessageBox.alert('Alert','弹出窗口Alert',function(){alert('abc')});              

                   }

           );

    </script>

     

     

     

     

     

     

    二、对话框(Ext.MessageBox.confirm  或  Ext.Msg.confirm)

    confirmString title, String msg, [Function fn], [Object scope] )

    title:标题

    msg:显示内容

    fn:回调函数

    Js代码

    <script type="text/javascript">

        Ext.onReady( function(){

               Ext.MessageBox.confirm( "请确认", "是否要删除指定内容", function(button,text){

                  alert(button);

               } );

           }

        );

    </script>

     

     

     

     

     

     

     

     

    三、对话框(Ext.MessageBox.prompt 或 Ext.Msg.prompt )

    promptString title, String msg, [Function fn], [Object scope] )

    title:标题

    msg:显示内容

    fn:回调函数

    Js代码

    <script type="text/javascript">

        Ext.onReady( function(){

               Ext.MessageBox.prompt( "输入提示框", "请输入您的年龄", function(button,text){

                  alert(button);

                  alert(text);

               } );

           }

        );

    </script>

     

     

     

     

     

     

     

     

     

     

    四、对话框(Ext.MessageBox.show 或 Ext.MsgBox.show)

    Js代码

    Ext.onReady( function(){

        Ext.MessageBox.show( {

           title:"保存数据",

           msg:"你已经作了一些数据修改,是否要保存当前内容的修改?",

           buttons:Ext.Msg.YESNOCANCEL,

           fn:save,

           icon:Ext.MessageBox.QUESTION});

        }

    );

  • 相关阅读:
    SQLSERVER调用DLL程序
    RAISERROR语句
    SQLSERVER表联结(INNER JOIN,LEFT JOIN,RIGHT JOIN,FULL JOIN,CROSS JOIN,CROSS APPLY,OUTER APPLY)
    SQL Server在存储过程中编写事务处理代码的三种方法
    找出表中缺失的连续数据(如:2,4,7,9;需要找出:1,3,5,6,8的数据)
    sqlserver用于统计表索引情况
    你需要了解的HTTP协议
    自己实现一个类似 jQuery 的函数库
    JS 函数 学习笔记
    JS 数组 学习笔记
  • 原文地址:https://www.cnblogs.com/siyunianhua/p/3516494.html
Copyright © 2020-2023  润新知