document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { //navigator.splashscreen.hide(); document.addEventListener("backbutton", onBackKeyDown, false); } function onBackKeyDown() { Toast.showShort('再点击一次退出!'); document.removeEventListener("backbutton", onBackKeyDown, false); // 注销返回键 document.addEventListener("backbutton", exitApp, false);//绑定退出事件 // 3秒后重新注册 var intervalID = window.setInterval(function() { window.clearInterval(intervalID); document.removeEventListener("backbutton", exitApp, false); // 注销返回键 document.addEventListener("backbutton", onBackKeyDown, false); // 返回键 }, 3000); } function exitApp(){ navigator.app.exitApp(); }
上面的代码中需要一个toast插件,这个是需要自己实现的,当然你可以使用纯JS写一个模仿android。
比如我提供一个现成的(PS:本人没有使用过,不知道有没有效果!)
/** * 自定义toast,js实现android中toast效果 * @param msg 显示文字 * @param duration 显示的时间长度 */ function showToast(msg, duration) { duration = isNaN(duration) ? 3000 : duration; var m = document.createElement('div'); m.innerHTML = msg; m.style.cssText = "width:60%; min-width:150px; background:#000; opacity:0.5; height:40px; color:#fff; line-height:40px; text-align:center; border-radius:5px; position:fixed; top:70%; left:20%; z-index:999999; font-weight:bold;"; document.body.appendChild(m); setTimeout(function() { var d = 0.5; m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in'; m.style.opacity = '0'; setTimeout(function() { document.body.removeChild(m) }, d * 1000); }, duration); }
我采用的是插件的形式:
1,用java写一个cordova插件(本人只会java,object-c不会,所以要在iphone上跑还需要用object-c写一个,这是使用插件不足的地方,不过可以网上搜一下,这种小插件基本可以搞定!)
package com.mobovip.mobile.plugin.toast; import org.apache.cordova.CallbackContext; import org.apache.cordova.CordovaPlugin; import org.json.JSONArray; import org.json.JSONException; import android.widget.Toast; public class ToastPlugin extends CordovaPlugin { private static final int TOAST_MESSAGE_INDEX = 0; private Toast toast = null; @Override public boolean execute(String action, JSONArray data, CallbackContext callbackContext) throws JSONException { if(action.equals("show_short")){ String message = data.getString(TOAST_MESSAGE_INDEX); showToast(message, Toast.LENGTH_SHORT); }else if(action.equals("show_long")){ String message = data.getString(TOAST_MESSAGE_INDEX); showToast(message, Toast.LENGTH_LONG); }else if(action.equals("cancel")){ cancelToast(); } callbackContext.success(); return true; } private void showToast(final String message, final int length) { cordova.getActivity().runOnUiThread(new Runnable(){ @Override public void run() { // TODO Auto-generated method stub toast = Toast.makeText(cordova.getActivity(), message, length); toast.show(); } }); } private void cancelToast() { cordova.getActivity().runOnUiThread(new Runnable() { @Override public void run() { if (toast != null){ toast.cancel(); } } }); } }
2,在res/xml/config.xml文件中增加插件配置
<feature name="Toast"> <param name="android-package" value="com.mobovip.mobile.plugin.toast.ToastPlugin" /> </feature>
3,在asserts/www/plugins/目录下实现自己插件的toast.js文件
cordova.define("com.mobovip.mobile.plugin.toast.Toast", function(require, exports, module) {/*global cordova, module*/ module.exports = { showShort: function (message, win, fail) { cordova.exec(win, fail, "Toast", "show_short", [message]); }, showLong: function (message, win, fail) { cordova.exec(win, fail, "Toast", "show_long", [message]); }, cancel: function (win, fail) { cordova.exec(win, fail, "Toast", "cancel", []); } }; });
4,添加toast插件js配置信息
在assets/www/cordova_plugins.js文件中添加如下信息:
module.exports = [ { "file": "plugins/com.mobovip.mobile.plugin.toast/www/toast.js", "id": "com.mobovip.mobile.plugin.toast.Toast", "clobbers": [ "Toast" //Js中使用的时候变量的名称 ] }, .........
同时加上插件的版本:
module.exports.metadata = // TOP OF METADATA { "com.mobovip.mobile.plugin.toast": "1.0.0", .........
5,代码调用
Toast.showShort('再点击一次退出!');