javaScript与app交互

最新推荐文章于 2024-02-28 22:15:59 发布

uniquemei

最新推荐文章于 2024-02-28 22:15:59 发布

阅读量969

点赞数

分类专栏： Android基础

本文链接：https://blog.csdn.net/uniquemei/article/details/51692717

版权

Android基础专栏收录该内容

70 篇文章 0 订阅

订阅专栏

在app中当我们加载一个webView时，如果我们需要与那个web页面进行交互时，我们需要怎么做呢？我们来看一下效果图

这里写图片描述

布局文件里有一个webView和一个Button按钮，当点击按钮的时候可以改变webView的背景颜色，当点击webView里的“关于我们”，可以跳转到另外一个activity，我们来看一下怎么实现的。

一、首先我们来看一下index.html里的内容

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8" />
        <title>js与app的交互</title>
    </head>
    <script>
        function goSecondActivity() {
            helper.goActivity()
        }
        function changeBackground(){
            document.body.style.background="#ccc"
        }
    </script>
    <body>
        <img src="img/face1.jpg" />
        <br/>
        <br/>
        <input onclick="goSecondActivity()" type="button" value="关于我们" />
    </body>
</html>

从代码上，我们可以看到当点击Button的时候，会执行goSecondActivity()方法，我们看到goSecondActivity()里，helper是一个需要在activity引用的一个别名，goActivity()是activity的一个方法。

二、我们来看一下主activity里的内容

package com.example.firstproject;

import butterknife.Bind;
import butterknife.ButterKnife;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.content.Intent;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.JavascriptInterface;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.os.Build;

public class JSMainActivity extends ActionBarActivity {
    @Bind(R.id.myWeb)
    WebView myWeb;
    @Bind(R.id.change)
    Button changeBackground;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.js_activity_main);
        ButterKnife.bind(this);
        myWeb.getSettings().setJavaScriptEnabled(true);// 设置可以与javaScript交互
        myWeb.setWebViewClient(new WebViewClient());
        myWeb.setWebChromeClient(new WebChromeClient());
        //helper是一个在html里存在的一个别名
        myWeb.addJavascriptInterface(new JsHelper(), "helper");
        myWeb.loadUrl("file:///android_asset/hybird/index.html");
    }   

    public class JsHelper {
        @JavascriptInterface
        public void goActivity() {
            Intent intent = new Intent(JSMainActivity.this, JSTwoActivity.class);
            startActivity(intent);
        }
    }

    public void changeBackgroud(View view) {
        myWeb.loadUrl("javascript:changeBackground()");
    }

}

我们可以看到index.html 的存放目录

这里写图片描述

uniquemei

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
javaScript与app交互

在app中当我们加载一个webView时，如果我们需要与那个web页面进行交互时，我们需要怎么做呢？我们来看一下效果图布局文件里有一个webView和一个Button按钮，当点击按钮的时候可以改变webView的背景颜色，当点击webView里的“关于我们”，可以跳转到另外一个activity，我们来看一下怎么实现的。一、首先我们来看一下index.html里的内容<!DOCTYPE html><
复制链接

扫一扫

专栏目录