Skip to content

huajs/huaDialog

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

#huadialog npm version devDependencies

huadialog是一款优秀的弹出框插件,旨在替换和统一弹出框,出三种基本的弹出框外,用户可自定义对话框内容(可以使文本也可以是html对象), 同时用户也可以自定义弹出框的样式.当然你也可以下载源码自行扩展.

##三种基本弹出框 ###huadialog.alert(string[,isLocked,zIndex])

  huadialog.alert('nice to meet you,huadialog!');
  
  huadialog.alert('nice to meet you,huadialog!',true);
  
  huadialog.alert('nice to meet you,huadialog!',true,1000);
  
  huadialog.alert({
  string:'nice to meet you,huadialog!',
  isLocked:false,
  zIndex:1000
  });

###huadialog.confirm(string[, ok, cancel, isLocked, zIndex])

huadialog.confirm(
'good morning!Are you OK?',
function(){
console.log('ok click!');
},
function(){
console.log('you clicked cancel!');
}
);

huadialog.confirm({
string:'good morning! Are you OK?',
ok:function(){
console.log('you clicked ok!');
},
cancel:function(){
console.log('you clicked cancel!');
},
isLocked:false,
zIndex:1000
});

###huadialog.prompt(string[, ok, cancel, isLocked, zIndex])

huadialog.prompt(
'type what you want!',
function(str){
console.log('user type string is:'+str);
},
function(){
console.log('you clicked cancel!');
}
);

huadialog.confirm({
string:'type what you want!',
ok:function(str){
console.log('user type string is:'+str);
},
cancel:function(){
console.log('you clicked cancel!');
},
isLocked:false,
zIndex:1000
});

##自定义弹出框 ##options title
标题设置 [String] 默认:title

content
弹框内容 [String|htmlObject]

width
弹框宽度[String] 默认:auto

height
弹框高度 [String] 默认:auto

backdropBackground
弹框背景的背景色 [String] 默认:#000

backgroundOpacity
弹框背景的透明度 [String] 默认:0.3

locked
是否显示弹出背景 [Boolean] 默认:false

statusbar 状态栏信息 [String | HtmlObject]

ok
确认按钮回调方法 [Function]

cancel
取消按钮回调方法 [Function]

okValue
确定按钮文本值 [String]

cancelValue
取消按钮文本值 [String]

closeBtn
是否显示关闭按钮 [String]

zIndex
css中z-index值 [Number]

##methods show() title() conent() width() height() statusbar() backdropBackground() backdropOpacity() closeBrn() ok() cancel okValue cancelValue close() remove()

var dialog=new huadialog({
title:'title',
content:'hello,huadialog!'
});
//显示弹出框
dialog.show();

//设置宽度
dialog.width('300px');

//关闭文本框
dialog.close();

//移除文本框
dialog.remove();

##event show close remove okClick cancelClick

var dialog=new 
var dialog=new huadialog({
title:'title',
content:'hello,huadialog!'
});
dialog.show();

dialog.addEventListener('show',function(){
console.log('dialog show');
});

dialog.addEventListener('close',function(){
console.log('dialog closed!');
});

About

replace the web default dialog alert,prompt,confirm and you also can display html code

Resources

License

Stars

Watchers

Forks

Packages

No packages published