弹出窗口\对话框插件

这个插件将通过navigator.notification对象调用平台本地对话框UI元素。需要在deviceready事件之后才能使用。

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
   //do something
console.log(navigator.notification); 
}

方法:

显示自定义警报或对话框navigator.notification.alert

Cordova大多数实现使用本地 对话框的这一特征,但一些平台使用浏览器的警报的功能,通常是不可定制。

navigator.notification.alert(message, alertCallback, [title], [buttonName])

参数说明:

message: 对话框的内容信息. (String)

alertCallback: 回调调用时被警告对话框 (Function)

title: 对话框的标题。 (String) (可选, 默认是 Alert)

buttonName: 按钮的名称. (String) (可选, 默认是 OK)

例子:

function alertDismissed() {
    // do something
}
navigator.notification.alert(
    'You are the winner!',  // message
    alertDismissed,         // callback
    'Game Over',            // title
    'Done'                  // buttonName
);

显示一个可定制的确认对话框 navigator.notification.confirm

navigator.notification.confirm(message, confirmCallback, [title], [buttonLabels])

参数说明

message: 对话框的内容信息. (String)

confirmCallback:回调调用指标按下按钮(1, 2,3)或当对话框消失且没有按键(0)。回调得到的参数是buttonindex  按钮的索引值所以值1,2,3等 (Function)

title: 对话框的标题。 (String) (可选, 默认是 Confirm)

buttonLabels: 指定按钮标签字符串数组. (Array) (可选, 默认是 [OK,Cancel])

例子

function onConfirm(buttonIndex) {
    alert('You selected button ' + buttonIndex);
}
navigator.notification.confirm(
    'You are the winner!', // message
     onConfirm,            // callback to invoke with index of button pressed
    'Game Over',           // title
    ['Restart','Exit']     // buttonLabels
);

注意:Android最多支持3个按键,大于3个的将被忽略;Windows Phone 8.1是不可能有两个以上的按钮,显示对话框。

显示一个对话框带提示功能navigator.notification.prompt

navigator.notification.prompt(message, promptCallback, [title], [buttonLabels], [defaultText])

message:对话框的内容信息. (String)

promptCallback: 回调调用指标按下按钮(1, 2,3)或当对话框消失且没有按键(0)。返回的参数包括buttonindex(按钮的索引值所以值1,2,3等)  和input1(文本输入提示内容 (Function)

title: 对话框的标题。 (String) (可选, 默认是  Prompt)

buttonLabels: 指定按钮标签字符串数组. (Array) (可选, 默认是 ["OK","Cancel"])

defaultText: 默认的文本框中输入值 (String) (可选,默认为空字符串)

例子

function onPrompt(results) {
    alert("You selected button number " + results.buttonIndex + " and entered " + results.input1);
}
navigator.notification.prompt(
    'Please enter your name',  // message
    onPrompt,                  // callback to invoke
    'Registration',            // title
    ['Ok','Exit'],             // buttonLabels
    'Jane Doe'                 // defaultText
);

注意:Android最多支持3个按键,大于3个的将被忽略;

 

发出嘟嘟的声音navigator.notification.beep

navigator.notification.beep(times);

参数说明:

times: 重复的哔声的次数(Number)

// 哔声2次!
navigator.notification.beep(2);

完整例子代码

<!DOCTYPE>
<html>
	<head>
		<title>lbuilder demo</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
		<meta http-equiv="Cache-Control" content="no-siteapp"/>
		<script type="text/javascript">
			//Alert 弹窗
			function dialogAlert() {
			   var message = "I am Alert Dialog!";
			   var title = "ALERT";
			   var buttonName = "Alert Button";
				
			   navigator.notification.alert(message, alertCallback, title, buttonName);

			   function alertCallback() {
				  console.log("Alert is Dismissed!");
			   }
			}
			//确认信息窗口
			function dialogConfirm() {
			   var message = "Am I Confirm Dialog?";
			   var title = "CONFIRM";
			   var buttonLabels = "YES,NO";
				
			   navigator.notification.confirm(message, confirmCallback, title, buttonLabels);

			   function confirmCallback(buttonIndex) {
				  console.log("You clicked " + buttonIndex + " button!");
			   }
				
			}
			//创建提示功能
			function dialogPrompt() {
			   var message = "Am I Prompt Dialog?";
			   var title = "PROMPT";
			   var buttonLabels = ["YES","NO"];
			   var defaultText = "Default"
				
			   navigator.notification.prompt(message, promptCallback, title, buttonLabels, defaultText);

			   function promptCallback(result) {
				  console.log("You clicked " + result.buttonIndex + " button! \n" + 
					 "You entered " +  result.input1);
			   }
				
			}
			//创建蜂鸣声:用于呼叫音频蜂鸣声通知。times 参数将设置蜂鸣声信号的重复次数。
			function dialogBeep() {
			   var times = 2;
			   navigator.notification.beep(times);
			}
		</script>
	</head>
<body>
	<h3>Lbuilder demo</h3>
	<button onclick = "dialogAlert()">ALERT</button>
	<button onclick = "dialogConfirm()">CONFIRM</button>
	<button onclick = "dialogPrompt()">PROMPT</button>
	<button onclick = "dialogBeep()">BEEP</button>>
</body>
</html>