Android 与 Html5 、JS交互

Android与Html5、JS做交互分为两种情况。

1. Html5调用Android的方法

    在Android上展示Html5的页面是通过控件WebView实现的，这我们都知道。而Html端若想调用Android的东西，只能通过Android端在load这个界面之前，给WebVeiw添加一个对象，然后Html端去获取这个对象。

    通过这个对象我们可以做很多东西，因为Html端获得这个对象后就可以调取这个对象内的任意方法。例如：传值、跳转等。

    首先来看Android端需要做的：

         1. 创建一个对象；
         2. 在onCreate（）中讲这个对象传递过去；
         3. load这个页面；

    代码如下：

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        wv_main_body = (WebView) findViewById(R.id.wv_main_body);

        // 把本类的一个实例添加到js的全局对象window中，
        wv_main_body.addJavascriptInterface(new InJavaScript(this), "android_lvstudio");
        wv_main_body.loadUrl("file:///android_asset/webpage.html");

    }

`/**
 * 需要传递给Html端的对象类
 * @author LvStudio
 *
 */
final class InJavaScript {
    private Context context;

    public InJavaScript() {

    }

    /**
     * 由于涉及到了跳转，上下文对象Context需要通过构造传过来。当然也可以传其他东西。
     * 
     * @param context
     */
    public InJavaScript(Context context) {
        this.context = context;
    }

    /**
     * 简单的点击跳转，不涉及参数及返回值。
     */
    @JavascriptInterface
    public void goNext() {
        Intent it = new Intent(context, OtherActivity.class);
        context.startActivity(it);
    }

    /**
     * 通过获取Html端的参数，进行操作后，将结果返回给Html端。
     * 
     * 此处可进行本地数据库操作，网络请求等，适需求而定。
     * 
     * @param num1
     * @param num2
     * @return
     */
    @JavascriptInterface
    public int queryData(int num1, int num2) {
        int sum = 0;
        sum = num1 + num2;
        return sum;
    }
}`

    **然后是Html端需要做的就是通过这个对象调用相应的方法。**
    代码如下：

window.android_lvstudio.goNext();// 跳转
var sum = window.android_lvstudio.queryData(1,1); // 传值比获取返回值

2. Android调用Html5的方法

这块的操作就比较简单了，直接通过loadUrl（）就可以了。

简单的传字符串过去，代码如下：

wv_main_body.loadUrl("javascript:writeInAndroid("+"这是传给Html端的参数"+")");// 向Html页面传值

加班中仓促~~~，注意事项稍后补充。