在Android的webview中定制js的alert,confirm和prompt对话框的方法

1.首先继承android.webkit.WebChromeClient实现MyWebChromeClient。

2.在MyWebChromeClient.java中覆盖onJsAlert,onJsConfirm,onJsPrompt三个方法。

3.在初始化Webview时设置调用webview.setWebChromeClient(new MyWebChromeClient());

4.在Webview载入的html中使用window.alert,window.confirm,window.prompt方法,系统弹出的将是自定义实现的对应对话框。

MyWebChromeClient.java的代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
import android.app.AlertDialog;  
import android.content.DialogInterface;
import android.content.DialogInterface.OnCancelListener;
import android.content.DialogInterface.OnClickListener;
import android.content.DialogInterface.OnKeyListener;
import android.graphics.Bitmap;
import android.os.Message;
import android.util.Log;
import android.view.KeyEvent;
import android.webkit.JsPromptResult;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.widget.EditText;

/**
* http://618119.com/archives/2010/12/20/199.html
*/

//****************************************************************************
public class MyWebChromeClient extends WebChromeClient {
@Override
public void onCloseWindow(WebView window) {
super.onCloseWindow(window);
}

@Override
public boolean onCreateWindow(WebView view, boolean dialog,
boolean userGesture, Message resultMsg) {
return super.onCreateWindow(view, dialog, userGesture, resultMsg);
}

/**
* 覆盖默认的window.alert展示界面,避免title里显示为“:来自file:////”
*/
public boolean onJsAlert(WebView view, String url, String message,
JsResult result) {
final AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());

builder.setTitle("对话框")
.setMessage(message)
.setPositiveButton("确定", null);

// 不需要绑定按键事件
// 屏蔽keycode等于84之类的按键
builder.setOnKeyListener(new OnKeyListener() {
public boolean onKey(DialogInterface dialog, int keyCode,KeyEvent event) {
Log.v("onJsAlert", "keyCode==" + keyCode + "event="+ event);
return true;
}
});
// 禁止响应按back键的事件
builder.setCancelable(false);
AlertDialog dialog = builder.create();
dialog.show();
result.confirm();// 因为没有绑定事件,需要强行confirm,否则页面会变黑显示不了内容。
return true;
// return super.onJsAlert(view, url, message, result);
}

public boolean onJsBeforeUnload(WebView view, String url,
String message, JsResult result) {
return super.onJsBeforeUnload(view, url, message, result);
}

/**
* 覆盖默认的window.confirm展示界面,避免title里显示为“:来自file:////”
*/
public boolean onJsConfirm(WebView view, String url, String message,
final JsResult result) {
final AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());
builder.setTitle("对话框")
.setMessage(message)
.setPositiveButton("确定",new OnClickListener() {
public void onClick(DialogInterface dialog,int which) {
result.confirm();
}
})
.setNeutralButton("取消", new OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
result.cancel();
}
});
builder.setOnCancelListener(new OnCancelListener() {
@Override
public void onCancel(DialogInterface dialog) {
result.cancel();
}
});

// 屏蔽keycode等于84之类的按键,避免按键后导致对话框消息而页面无法再弹出对话框的问题
builder.setOnKeyListener(new OnKeyListener() {
@Override
public boolean onKey(DialogInterface dialog, int keyCode,KeyEvent event) {
Log.v("onJsConfirm", "keyCode==" + keyCode + "event="+ event);
return true;
}
});
// 禁止响应按back键的事件
// builder.setCancelable(false);
AlertDialog dialog = builder.create();
dialog.show();
return true;
// return super.onJsConfirm(view, url, message, result);
}

/**
* 覆盖默认的window.prompt展示界面,避免title里显示为“:来自file:////”
* window.prompt('请输入您的域名地址', '618119.com');
*/
public boolean onJsPrompt(WebView view, String url, String message,
String defaultValue, final JsPromptResult result) {
final AlertDialog.Builder builder = new AlertDialog.Builder(view.getContext());

builder.setTitle("对话框").setMessage(message);

final EditText et = new EditText(view.getContext());
et.setSingleLine();
et.setText(defaultValue);
builder.setView(et)
.setPositiveButton("确定", new OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
result.confirm(et.getText().toString());
}

})
.setNeutralButton("取消", new OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
result.cancel();
}
});

// 屏蔽keycode等于84之类的按键,避免按键后导致对话框消息而页面无法再弹出对话框的问题
builder.setOnKeyListener(new OnKeyListener() {
public boolean onKey(DialogInterface dialog, int keyCode,KeyEvent event) {
Log.v("onJsPrompt", "keyCode==" + keyCode + "event="+ event);
return true;
}
});

// 禁止响应按back键的事件
// builder.setCancelable(false);
AlertDialog dialog = builder.create();
dialog.show();
return true;
// return super.onJsPrompt(view, url, message, defaultValue,
// result);
}

@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
}

@Override
public void onReceivedIcon(WebView view, Bitmap icon) {
super.onReceivedIcon(view, icon);
}

@Override
public void onReceivedTitle(WebView view, String title) {
super.onReceivedTitle(view, title);
}

@Override
public void onRequestFocus(WebView view) {
super.onRequestFocus(view);
}
}

webview js alert对话框 不能弹出 解决办法

在配置了webview的 setting属性后,以前设置的都是可以直接弹出来的,今天写一个小demo时候莫名其妙的发现alert怎么也出来,即使设置了这么多也不行:

1
2
3
4
5
6
7
8
9
webSettings.setJavaScriptEnabled(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
webSettings.setAllowFileAccess(true);// 设置允许访问文件数据
webSettings.setSupportZoom(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webSettings.setDomStorageEnabled(true);
webSettings.setDatabaseEnabled(true);

解决办法:
webview只是一个承载体,各种内容的渲染需要使用webviewChromClient去实现,所以set一个默认的基类WebChromeClient就行,代码如下:
mWebView.setWebChromeClient(new WebChromeClient());