WebView can't call JavaScript function

Question

I have tried everything and still doesn't work, please help:

I setup my WebView here:

public class MainActivity extends ActionBarActivity {
    private WebView mWebView;
    private MyWebViewClient mWebViewClient;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        mWebViewClient = new MyWebViewClient(context);
        mWebView = (WebView) findViewById(R.id.activity_main_webview);
        mWebView.addJavascriptInterface(mWebViewClient, "Android");
        WebSettings webSettings = mWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        webSettings.setAllowFileAccessFromFileURLs(true);
        webSettings.setAllowUniversalAccessFromFileURLs(true);
        webSettings.setDomStorageEnabled(true);
        mWebView.setWebViewClient(mWebViewClient);
        mWebView.loadUrl("file:///android_asset/index.html");
    }
}

This is where I call my function from JS:

    <script>
            $("#logInButton").click(function(){
                if(isAndroid){
                    Android.onJavaLogIn();
                }
                return false;
            });
    </script>
    <input type="button" value="Log In" id="logInButton" />

Here is how I handle it:

public class MyWebViewClient extends android.webkit.WebViewClient {
    private MainActivity context;

    public MyWebViewClient(MainActivity context) {
        this.context = context;
    }
    @JavascriptInterface
    public void onJavaLogIn(){
        context.onMainLogIn();
    }

}
public class MainActivity extends ActionBarActivity {
    public void onMainLogIn(){
        mWebView.loadUrl("javascript:onJSLogIn();");
    }
}

This is the JS function it's suppose to call:

    <script>
        function onJSLogIn(){
            $("#logInButton").hide();
            $("#logOutButton").show();
        }
    </script>

The entire chain seem to be correct, and I verify via debug that onMainLogIn() in MainActivity does get called, but the JS function onJSLogIn() never get called, why?

I wonder what is "isAndroid" in Java Script. How you set it up? Did you try removing "if (isAndroid)"? — cyanide
– cyanide, Commented Sep 12, 2015 at 20:47
IsAndroid definitely isn't the problem because onMainLogIn is called successfully — Bill Software Engineer
– Bill Software Engineer, Commented Sep 12, 2015 at 21:14

Bill Software Engineer · Accepted Answer · 2015-09-13 00:29:39Z

1

It turn out WebView only work on the main UI thread. So I had to warp the call function like this:

public void onMainLogIn(){
    this.runOnUiThread(new Runnable() {
        @Override
        public void run() {
            mWebView.loadUrl("javascript:onJSLogIn();");
        }
    });
}

answered Sep 13, 2015 at 0:29

Bill Software Engineer

7,87024 gold badges109 silver badges192 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Uday Sravan K · Accepted Answer · 2015-09-12 20:50:01Z

0

Yes, here everything looks fine. Since we can't debug it, we can only suggest few things.

1. First write one alert in onJSLogIn JS method to make sure function not getting called.Because logInButton, logOutButton dom elements might not have loaded.

2. Connect your webview to remote debug and check for errors using chrome ADB tool.

answered Sep 12, 2015 at 20:50

Uday Sravan K

1,5041 gold badge15 silver badges20 bronze badges

1 Comment

Bill Software Engineer Over a year ago

It seem like LoadURL isn't working on subsequent call, any idea as to why?

Collectives™ on Stack Overflow

WebView can't call JavaScript function

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related