---恢复内容开始---

1.通过WebView加载Html界面。在android studio中html放在assets中。

但是默认的并不存在这个文件夹,创建过程是

2.创建后简单实现下,js调用android中的方法。过onclick="window.android.startFunction()" window.android.方法名 调用android方法

  <1>创建html文件 橘黄色为适配手机屏幕代码

<!doctype html>
<html>
<head>
<!-- 设置当前HTML文件的字符编码 -->
<meta charset="utf-8">
<!-- 设置浏览器的兼容模式版本 (让IE使用最新的渲染引擎工作) -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 声明当前网页在移动端浏览器中展示的相关设置 -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head>
<body>
这里是HTML <br/>
<h1><div id="content">HTML内容显示</div></h1>
<br/>
<input type="button" value="调用android代码" onclick="window.android.startFunction()" />
<br/>
<input type="button" value="调用android代码并传递参数" onclick="window.android.startFunction('这里是js调用Android方法')" />
</body>
</html>

   <2> Main布局只有一个webview

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="myapplication.com.myhtml.MainActivity"> <WebView android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent"
/> </LinearLayout>

 <3>Main代码

public class MainActivity extends AppCompatActivity {
private WebView contentWebView = null; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
contentWebView = (WebView) findViewById(R.id.webview);
// 启用javascript
contentWebView.getSettings().setJavaScriptEnabled(true);
// 从assets目录下面的加载html
contentWebView.loadUrl("file:///android_asset/b.html");
contentWebView.addJavascriptInterface(MainActivity.this,"android"); } //由于安全原因 需要加 @JavascriptInterface
@JavascriptInterface
public void startFunction(){ runOnUiThread(new Runnable() {
@Override
public void run() {
Toast.makeText(MainActivity.this,"Toast",Toast.LENGTH_SHORT).show(); }
});
} @JavascriptInterface
public void startFunction(final String text){
runOnUiThread(new Runnable() { @Override
public void run() {
new AlertDialog.Builder(MainActivity.this).setMessage(text).show(); }
}); }
}

其实现效果图:

3 android 调用html js方法  

  <1> Html文件如下,script中有二个方法,共android中调用。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<script type="text/javascript"> function javacalljs(){
document.getElementById("content").innerHTML =
"<br\>JAVA调用了JS的无参函数";
} function javacalljswith(arg){
document.getElementById("content").innerHTML =
("<br\>"+arg);
}
</script>

</head>
<body>
这里是HTML <br/>
<h1><div id="content">内容显示</div></h1>
<br/>
<input type="button" value="点击调用java代码" onclick="window.android.startFunction()" />
<br/>
<input type="button" value="点击调用java代码并传递参数" onclick="window.android.startFunction('http://blog.csdn.net/Leejizhou')" />
</body>
</html>

  <2>通过webView.loadUrl("javascript:方法名"); 来调用js中的方法。

public class MainActivity extends AppCompatActivity {
private WebView contentWebView = null; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
contentWebView = (WebView) findViewById(R.id.webview);
// 启用javascript
contentWebView.getSettings().setJavaScriptEnabled(true);
// 从assets目录下面的加载html
contentWebView.loadUrl("file:///android_asset/b.html");
contentWebView.addJavascriptInterface(MainActivity.this,"android"); //无参调用Js点击
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 无参数调用
contentWebView.loadUrl("javascript:javacalljs()"); }
});
//有参调用Js点击
findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 传递参数调用
contentWebView.loadUrl("javascript:javacalljswith(" + "'这里是调用js方法'" + ")");
}
}); }

实现图如下:

4.code      

http://pan.baidu.com/s/1pK9u7MV   工作--新文件--myhtml

Android和Html的简单交互的更多相关文章

  1. android json解析及简单例子+Android与服务器端数据交互+Android精彩案例【申明:来源于网络】

    android json解析及简单例子+Android与服务器端数据交互+Android精彩案例[申明:来源于网络] android json解析及简单例子:http://www.open-open. ...

  2. Android客户端和服务器端数据交互

    网上有很多例子来演示Android客户端和服务器端数据如何实现交互不过这些例子大多比较繁杂,对于初学者来说这是不利的,现在介绍几种代码简单.逻辑清晰的交互例子,本篇博客介绍第四种: 一.服务器端: 代 ...

  3. Android客户端与服务端交互之登陆示例

    Android客户端与服务端交互之登陆示例 今天了解了一下android客户端与服务端是怎样交互的,发现其实跟web有点类似吧,然后网上找了大神的登陆示例,是基于IntentService的 1.后台 ...

  4. 我的Android进阶之旅】GitHub 上排名前 100 的 Android 开源库进行简单的介绍

    GitHub Android Libraries Top 100 简介 本文转载于:https://github.com/Freelander/Android_Data/blob/master/And ...

  5. Xamarin.Android之封装个简单的网络请求类

    一.前言 回忆到上篇 <Xamarin.Android再体验之简单的登录Demo> 做登录时,用的是GET的请求,还用的是同步, 于是现在将其简单的改写,做了个简单的封装,包含基于Http ...

  6. [电子书] 《Android编程入门很简单》

    <Android编程入门很简单>是一本与众不同的Android学习读物,是一本化繁为简,把抽象问题具体化,把复杂问题简单化的书.本书避免出现云山雾罩.晦涩难懂的讲解,代之以轻松活泼.由浅入 ...

  7. [原创]Android中LocationManager的简单使用,获取当前位置

    Android中LocationManager的提供了一系列方法来地理位置相关的问题,包括查询上一个已知位置:注册/注销来自某个 LocationProvider的周期性的位置更新:以及注册/注销接近 ...

  8. cocos2d-x lua与c++简单交互

    cocos2d-x lua与c++简单交互 version: cocos2d-x 3.6 本文讲述lua与c++的一些简单交互: lua通过消息方式调用c++无参接口 c++调用lua带参接口 1.通 ...

  9. android code 和js的交互

    小弟现在需要android code 和js的交互.出现了问题,求大家带一带啊. 我的页面:<!DOCTYPE html><html lang="en">& ...

随机推荐

  1. 杭电2061WA

    #include<stdio.h> struct mem { char s[50]; int c; int f; }; int main() { struct mem x[60]; int ...

  2. (转)RabbitMQ学习之exchange总结

    http://blog.csdn.net/zhu_tianwei/article/details/53969674 前面介绍了几类exchange的作用,这个总结一下: direct:消息会被推送至绑 ...

  3. sql 查询多列 小于某值

    select COUNT(*) from ( select ID,H1 AS Value from Table_1 union all select ID,H2 from Table_1 union ...

  4. BZOJ 1726: [Usaco2006 Nov]Roadblocks第二短路 Dijkstra

    Description 贝茜把家搬到了一个小农场,但她常常回到FJ的农场去拜访她的朋友.贝茜很喜欢路边的风景,不想那么快地结束她的旅途,于是她每次回农场,都会选择第二短的路径,而不象我们所习惯的那样, ...

  5. HDU 5126 stars (四维偏序+树状数组)

    题目大意:略 题目传送门 四维偏序板子题 把插入操作和询问操作抽象成$(x,y,z,t)$这样的四元组 询问操作拆分成八个询问容斥 此外$x,y,z$可能很大,需要离散 直接处理四维偏序很困难,考虑降 ...

  6. 地图API示例

    http://developer.baidu.com/map/jsdemo.htm#i6_2

  7. Redis 报错:MISCONF Redis is configured to save RDB snapshots

    MISCONF Redis is configured to save RDB snapshots, but is currently not able to persist on disk. Com ...

  8. 【CodeForces 987C】Three displays

    [链接] 我是链接,点我呀:) [题意] [题解] 动态规划 设dp[i][j]表示前i个数字,选了j个的最小花费. dp[i][j] = min(dp[k][j-1]+b[i]);//其中a[i]& ...

  9. C++ constexpr类型说明符

    本系列文章由 @yhl_leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/50864210 关键字 constexp ...

  10. 第二篇:SpringBoot配置详解

    SpringBoot 是为了简化 Spring 应用的创建.运行.调试.部署等一系列问题而诞生的产物,自动装配的特性让我们可以更好的关注业务本身而不是外部的XML配置,我们只需遵循规范,引入相关的依赖 ...