Android WebView展示html,其中html点击上传图片无反应解决
时间: 2023-08-16 10:06:56 浏览: 191
Android编程使WebView支持HTML5 Video全屏播放的解决方法
5星 · 资源好评率100%
要在 Android WebView 中实现点击上传图片的功能,需要做以下几个步骤:
1. 在 WebView 中启用 JavaScript:
```java
webView.getSettings().setJavaScriptEnabled(true);
```
2. 为 WebView 设置 WebChromeClient:
```java
webView.setWebChromeClient(new WebChromeClient() {
// For Android 5.0+
@Override
public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {
if (mFilePathCallback != null) {
mFilePathCallback.onReceiveValue(null);
}
mFilePathCallback = filePathCallback;
Intent intent = fileChooserParams.createIntent();
try {
startActivityForResult(intent, REQUEST_SELECT_FILE);
} catch (ActivityNotFoundException e) {
mFilePathCallback = null;
Toast.makeText(MainActivity.this, "Cannot open file chooser", Toast.LENGTH_SHORT).show();
return false;
}
return true;
}
// For Android < 5.0
public void openFileChooser(ValueCallback<Uri> uploadMsg) {
openFileChooser(uploadMsg, null);
}
// For Android 3.0+
public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType) {
mUploadMessage = uploadMsg;
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.addCategory(Intent.CATEGORY_OPENABLE);
intent.setType("*/*");
startActivityForResult(Intent.createChooser(intent, "File Chooser"), FILECHOOSER_RESULTCODE);
}
});
```
这里的 `onShowFileChooser()` 方法是为了支持 Android 5.0 及以上版本的文件上传, `openFileChooser()` 方法是为了支持 Android 3.0 至 Android 4.4 版本的文件上传。在 `onActivityResult()` 方法中处理选择的文件并返回给 WebView:
```java
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
if (requestCode == FILECHOOSER_RESULTCODE) {
if (null == mUploadMessage) return;
Uri result = data == null || resultCode != RESULT_OK ? null : data.getData();
mUploadMessage.onReceiveValue(result);
mUploadMessage = null;
} else if (requestCode == REQUEST_SELECT_FILE) {
if (mFilePathCallback == null) return;
Uri[] results = null;
// Check that the response is a good one
if (resultCode == Activity.RESULT_OK) {
if (data == null) {
// If there is not data, then we may have taken a photo
if (mCameraPhotoPath != null) {
results = new Uri[]{Uri.parse(mCameraPhotoPath)};
}
} else {
String dataString = data.getDataString();
ClipData clipData = data.getClipData();
if (clipData != null) {
results = new Uri[clipData.getItemCount()];
for (int i = 0; i < clipData.getItemCount(); i++) {
ClipData.Item item = clipData.getItemAt(i);
results[i] = item.getUri();
}
}
if (dataString != null) {
results = new Uri[]{Uri.parse(dataString)};
}
}
}
mFilePathCallback.onReceiveValue(results);
mFilePathCallback = null;
}
}
```
3. 在 HTML 中添加上传文件的代码:
```html
<input type="file" id="fileInput" name="fileInput" multiple>
```
这里的 `id` 和 `name` 两个属性都必须为 `fileInput`,否则在 WebView 中无法触发文件上传事件。同时,为了支持多选文件,可以将 `multiple` 属性设置为 `true`。
4. 在 JavaScript 中触发文件上传事件:
```javascript
document.getElementById("fileInput").click();
```
这里的 `click()` 方法是为了模拟用户点击上传文件按钮。当用户点击上传文件按钮时,WebView 就会弹出文件选择框。
阅读全文