webview與js交互

我們知道有時(shí)候我們需要和html交互怎么辦呢寡夹?安卓大牛已經(jīng)為我們提供了方法了畴博,我們來看看吧~

  • Android(Java)與JavaScript(HTML)交互有四種情況:
  • 1) Android(Java)調(diào)用HTML中js代碼
  • 2) Android(Java)調(diào)用HTML中js代碼(帶參數(shù))
  • 3) HTML中js調(diào)用Android(Java)代碼
  • 4) HTML中js調(diào)用Android(Java)代碼(帶參數(shù))

廢話不多說們直接上代碼

package com.example.administrator.myapplication;

import android.content.Context;
import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.Toast;
import butterknife.Bind;
import butterknife.ButterKnife;

public class WebviewActivity extends AppCompatActivity {
    private static final String TAG = "WebviewActivity";
    private final String MESSAGE = "我是從安卓界面?zhèn)鬟f過來的";
    private  final String PATH="btn-paizhao.png";
    WebView wv;
    @Bind(R.id.toolbar) Toolbar mToolbar;
    @Bind(R.id.wv) WebView mWv;
    @Bind(R.id.bt) Button mBt;
    @Bind(R.id.fab) FloatingActionButton mFab;


    /**
     * 總結(jié)浴捆,如果只是單獨(dú)傳遞字符串诗力,可以不用把遠(yuǎn)端的html頁面下載下來,直接調(diào)用凭峡,如果涉及到顯示圖片
     * 就需要下載下來了拙已,你顯示的是本地的照片他找不到照片的!
     * @param savedInstanceState
     */
    @Override protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_webview);
        ButterKnife.bind(this);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        initView();
    }


    private void initView() {
        wv = (WebView) findViewById(R.id.wv);
        //設(shè)置編碼
        wv.getSettings().setDefaultTextEncodingName("utf-8");
        //支持js
        wv.getSettings().setJavaScriptEnabled(true);
          //wv.loadUrl("http://l123456789jy.github.io/blog/2015/01/16/test" +
              //  ".html");
        wv.loadUrl("file:///android_asset/main.html");
        //這樣讓js與webview建立起鏈接摧冀,webview里面的界面就可以使用 jsObj來調(diào)用安卓里面的寫好的方法了
        wv.addJavascriptInterface(new JavaScriptObject(this), "jsObj");     //
        // jsObj 為橋連對(duì)象

        //監(jiān)聽加載完畢的事件倍踪!
        wv.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageFinished(final WebView view, String url) {
                //  view.loadUrl("javascript:setData(" + detailshtml + ")");
                // 調(diào)用js里面寫入好的方法
                view.loadUrl("javascript:showFromHtml()");
                Log.e(TAG, "onPageFinished");
            }
        });
        //調(diào)用網(wǎng)頁的方法并且將數(shù)值傳遞過去
        mBt.setOnClickListener(new View.OnClickListener() {
            @Override public void onClick(View v) {
                wv.loadUrl("javascript: showFromHtml2('" + MESSAGE + "')");
                //設(shè)置圖片
                wv.loadUrl("javascript: setImage('" + PATH + "')");
            }
        });
    }


    //這個(gè)是讓js調(diào)用安卓的方法系宫!
    public class JavaScriptObject {
        Context mContxt;


        JavaScriptObject(Context mContxt) {
            this.mContxt = mContxt;
        }


        //4.4以上必須加上
        @JavascriptInterface public void SetTitle(String titileName) {//獲取標(biāo)題!
            Toast.makeText(getApplicationContext(), titileName,
                    Toast.LENGTH_LONG).show();
        }


        @JavascriptInterface public void callNatvie() {
            Toast.makeText(getApplicationContext(), "收到網(wǎng)頁的調(diào)用啦建车!",
                    Toast.LENGTH_LONG).show();
        }
    }
}


相信我在代碼中已經(jīng)寫的很詳細(xì)了扩借,我們看下htmL的代碼

我相信通過上面的的兩段代碼,已經(jīng)可以明白了缤至,如果我們需要調(diào)用系統(tǒng)的照相機(jī)潮罪,這種情況我們只能,要么把html下載到本地领斥,然后與調(diào)用嫉到,要么把圖片上上傳到服務(wù)器之后再將地址回掉給html來進(jìn)行顯示!

整個(gè)完整的demO

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末月洛,一起剝皮案震驚了整個(gè)濱河市何恶,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌嚼黔,老刑警劉巖细层,帶你破解...
    沈念sama閱讀 212,884評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異隔崎,居然都是意外死亡今艺,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,755評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門爵卒,熙熙樓的掌柜王于貴愁眉苦臉地迎上來虚缎,“玉大人,你說我怎么就攤上這事钓株∈的担” “怎么了?”我有些...
    開封第一講書人閱讀 158,369評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵轴合,是天一觀的道長创坞。 經(jīng)常有香客問我,道長受葛,這世上最難降的妖魔是什么题涨? 我笑而不...
    開封第一講書人閱讀 56,799評(píng)論 1 285
  • 正文 為了忘掉前任,我火速辦了婚禮总滩,結(jié)果婚禮上纲堵,老公的妹妹穿的比我還像新娘。我一直安慰自己闰渔,他們只是感情好席函,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,910評(píng)論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著冈涧,像睡著了一般茂附。 火紅的嫁衣襯著肌膚如雪正蛙。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 50,096評(píng)論 1 291
  • 那天营曼,我揣著相機(jī)與錄音乒验,去河邊找鬼。 笑死溶推,一個(gè)胖子當(dāng)著我的面吹牛徊件,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蒜危,決...
    沈念sama閱讀 39,159評(píng)論 3 411
  • 文/蒼蘭香墨 我猛地睜開眼虱痕,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了辐赞?” 一聲冷哼從身側(cè)響起部翘,我...
    開封第一講書人閱讀 37,917評(píng)論 0 268
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎响委,沒想到半個(gè)月后新思,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,360評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡赘风,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,673評(píng)論 2 327
  • 正文 我和宋清朗相戀三年夹囚,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片邀窃。...
    茶點(diǎn)故事閱讀 38,814評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡荸哟,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出瞬捕,到底是詐尸還是另有隱情鞍历,我是刑警寧澤,帶...
    沈念sama閱讀 34,509評(píng)論 4 334
  • 正文 年R本政府宣布肪虎,位于F島的核電站劣砍,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏扇救。R本人自食惡果不足惜刑枝,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,156評(píng)論 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望迅腔。 院中可真熱鬧仅讽,春花似錦、人聲如沸钾挟。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,882評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽掺出。三九已至徽千,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間汤锨,已是汗流浹背双抽。 一陣腳步聲響...
    開封第一講書人閱讀 32,123評(píng)論 1 267
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留闲礼,地道東北人牍汹。 一個(gè)月前我還...
    沈念sama閱讀 46,641評(píng)論 2 362
  • 正文 我出身青樓,卻偏偏與公主長得像柬泽,于是被迫代替她去往敵國和親慎菲。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,728評(píng)論 2 351

推薦閱讀更多精彩內(nèi)容