请问一个关于ViewPager中Webview调用JS方法的问题。

lettime 2014-10-27 04:14:43

我在ViewPager中装载Webview来显示HTML，同时显示的HTML中有图片，因此我注入了一个JS函数来跳转到另一个Activity中进行显示并能进行缩放操作。完整代码如下

public class SingalSubjectFragment extends Fragment {

private Context mContext;
private WebView mWebView;
private Subject mSubject = new Subject();

public SingalSubjectFragment(Context tContext,Subject subject){
this.mContext = tContext;
this.mSubject = subject;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

LinearLayout grouplayout = new LinearLayout(
getActivity().getApplicationContext());
final ProgressBar progressBar = new ProgressBar(mContext,null,android.R.attr.progressBarStyleHorizontal);
grouplayout.setOrientation(0);
grouplayout.addView(progressBar);
mWebView = new WebView(mContext);
mWebView.loadUrl(mSubject.getUrl());
grouplayout.addView(mWebView);

WebSettings settings = mWebView.getSettings();
settings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
settings.setDomStorageEnabled(true);

mWebView.addJavascriptInterface(new JavascriptInterface(getActivity()), "imagelistner");
mWebView.setWebViewClient(new MyWebViewClient());
mWebView.setWebChromeClient(new WebChromeClient(){
@Override
public void onProgressChanged(WebView view, int newProgress) {
// TODO Auto-generated method stub
super.onProgressChanged(view, newProgress);
if (newProgress == 0) {
progressBar.setVisibility(View.VISIBLE);
}
progressBar.setProgress(newProgress);
progressBar.postInvalidate();
if (newProgress == 100) {
//textView.setVisibility(View.GONE);
progressBar.setVisibility(View.GONE);
}
}
});
return grouplayout;
}

// 注入js函数监听
private void addImageClickListner() {
// 这段js函数的功能就是，遍历所有的img几点，并添加onclick函数，在还是执行的时候调用本地接口传递url过去
mWebView.loadUrl("javascript:(function(){" +
"var objs = document.getElementsByTagName(\"img\"); " +
"for(var i=0;i<objs.length;i++) " +
"{"
+ " objs[i].onclick=function() " +
" { "
+ " window.imagelistner.openImage(this.src); " +
" } " +
"}" +
"})()");
}

// js通信接口
public class JavascriptInterface {

private Context context;

public JavascriptInterface(Context context) {
this.context = context;
}

public void openImage(String img) {
String fName = img.trim();
String fileName = fName.substring(fName.lastIndexOf("/")+1);
Intent intent = new Intent();
intent.putExtra("image", img);
intent.putExtra("fileName", fileName);
intent.setClass(context, ShowWebImageActivity.class);
context.startActivity(intent);
//System.out.println(img);
}
}

// 监听
private class MyWebViewClient extends WebViewClient {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {

return super.shouldOverrideUrlLoading(view, url);
}

@Override
public void onPageFinished(WebView view, String url) {

view.getSettings().setJavaScriptEnabled(true);

super.onPageFinished(view, url);
// html加载完成之后，添加监听图片的点击js函数
addImageClickListner();

}

@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
view.getSettings().setJavaScriptEnabled(true);

super.onPageStarted(view, url, favicon);
}

@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {

super.onReceivedError(view, errorCode, description, failingUrl);

}
}

public void WebLoadUrl(String url){
mWebView.loadUrl(url);
}

}

当我加载第一个组网页中的第一个时，点击图片能够跳转到显示图片的Activity。但当我推出再通过ViewPager中的Webview加载另一组网页时，点击图片却无法跳转了，并有如下错误信息：
Uncaught TypeError: Cannot call method 'openImage' of undefined at null:1
同时我再次加载第一组网页时点击图片时也无法跳转了。
请问这个是什么问题，能怎么解决。

...全文