传统的alert,confirm等方法产生的对话框不好话,下面就看看ExtJS做的对话框的效果
一、普通的对话框:
Ext.onReady(function(){
Ext.get("btn").on("click",function(){ //普通的弹出提示框
Ext.MessageBox.alert("请注意","这是ExtJS的提示框");
});
});
Ext.get("btn").on("click",function(){ //普通的弹出提示框
Ext.MessageBox.alert("请注意","这是ExtJS的提示框");
});
});

二、弹出选择的提示框:
Ext.onReady(function(){
Ext.get("btn").on("click",function(){ //弹出选择的提示框
Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text){
alert(button);
alert(text);
});
});
});
Ext.get("btn").on("click",function(){ //弹出选择的提示框
Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text){
alert(button);
alert(text);
});
});
});

三、需要输入内容的对话框:
Ext.onReady(function(){
Ext.get("btn").on("click",function(){ //需要输入内容的对话框
Ext.MessageBox.prompt("输入提示框","请输入你的新年愿望:",function(button,text){
if(button=="ok"){
alert("您的新年愿望是:" + text);
}else
alert("你放弃了录入!");
});
});
});
Ext.get("btn").on("click",function(){ //需要输入内容的对话框
Ext.MessageBox.prompt("输入提示框","请输入你的新年愿望:",function(button,text){
if(button=="ok"){
alert("您的新年愿望是:" + text);
}else
alert("你放弃了录入!");
});
});
});

四、自定义对话框:
function save(button){
if(button=="yes"){
//执行数据库保存操作
}else if(button=="no"){
//不保存数据
}else{
//取消当前操作
}
}
Ext.onReady(function(){
Ext.get("btn").on("click",function(){
Ext.Msg.show({
title:"保存数据",
msg:"你已经作了一些数据操作,是否要保存当前内容的修改?",
buttons:Ext.Msg.YESNOCANCEL,
fn:save,
icon:Ext.MessageBox.QUESTION
});
});
});
if(button=="yes"){
//执行数据库保存操作
}else if(button=="no"){
//不保存数据
}else{
//取消当前操作
}
}
Ext.onReady(function(){
Ext.get("btn").on("click",function(){
Ext.Msg.show({
title:"保存数据",
msg:"你已经作了一些数据操作,是否要保存当前内容的修改?",
buttons:Ext.Msg.YESNOCANCEL,
fn:save,
icon:Ext.MessageBox.QUESTION
});
});
});

转载于:https://blog.51cto.com/rhyme/81630