Android中WebView載入本地Html，與JavaScript與Android方法相互傳值（續）
阿新 • • 發佈：2019-02-14
接著上篇Android中WebView載入本地Html，與JavaScript與Android方法相互傳值，今天來一篇續集，為什麼要來續集呢，感覺自己還有沒有交代完的部分，於是在這裡再次交代一下，在Android中我們需要將給複雜的資料傳到Html頁面，我們該怎麼做？
大家作為一直搞android或IOS的小夥伴們，有好多對Html都瞭解不是太多，於是思考了一番，無非就是向Html頁面傳值嗎？我就只會傳字串等基本的資料型別，遇到像List或Map中多層巢狀的複雜資料我該怎麼辦？我只會字串，我只會字串，我只會字串，於是我是想到了JSON，JSON作為資料交換的一種方式，我是該選擇JSON字串來幫我完成複雜的資料交換,是因為Android或JavaScript中都JSON轉換的方法，能夠方便的資料轉換。
上面我已經把問題拋了出來問題，解決的方法也已經給出。下面來一個簡單的例子來說明一下實現方法。
案例說明，我要將一個List傳到頁面做一個表格，就這麼簡單。
1.建立一個Person物件
package com.lidong.androiddemo;
/**
* Created by lidong on 16/7/2
*/
public class Person {
public String name;
public String age;
public String uint;
public Person(String name, String age, String uint) {
this 2.建立MyObeject
package com.lidong.androiddemo;
import android.content.Context;
import android.util.Log;
import android.webkit.JavascriptInterface;
import com.google.gson.Gson;
import java.util.ArrayList;
import java.util.List;
/**
* Created by lidong on 16/6/29.
*/ 3.MainActivity的實現
public class MainActivity extends AppCompatActivity {
private static final String TAG = MainActivity.class.getSimpleName();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = (WebView) findViewById(R.id.webView);
WebSettings settings = webView.getSettings();
//呼叫WebView關聯的WebSettings中setJavaScriptEnable(true)方法。
settings.setJavaScriptEnabled(true);
webView.loadUrl("file:///android_asset/index.html");
//呼叫WebView關聯的WebSettings中addJavaScriptInterface
webView.addJavascriptInterface(new MyObject(this,"dd"),"my");
}
}
4.index.html的實現
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>測試Android Json傳值</title>
<script src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
<script type="text/javascript">
$(function(){
//通過暴露的my物件來獲取資料
var data = my.getData();
//將json字串轉換為陣列
var f = eval(data);
//向表格填充資料
for(var i = 0;i<f.length;i++){
var en = f[i];
$("table").append("<tr><td>"+en.age+"</td><td>"+en.name+"</td><td>"+en.uint+"</td></tr>");
}
});
</script>
</head>
<body>
人員表
<div >
<table id="table" border="1" bgcolor="#ffddff"></table>
</div>
</body>
</html>這個案例基本上就四個步驟，通過這篇文章的學習媽媽在也不會擔心android向html傳複雜的資料了，謝謝學習
