> 웹 프론트엔드 > JS 튜토리얼 > Android와 JS 간의 간단한 상호작용

Android와 JS 간의 간단한 상호작용

不言
풀어 주다: 2018-04-10 13:39:23
원래의
1657명이 탐색했습니다.

이 글은 android와 js 사이의 간단한 상호작용에 대한 코드를 소개합니다. 이제 여러분과 공유하겠습니다. 도움이 필요한 친구들이 참고할 수 있습니다

권한:

import android.content.DialogInterface;
import android.os.Bundle;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;


/**
 * 注意事项:如何避免WebView内存泄露?
 * 不在xml中定义 Webview ,而是在需要的时候在Activity中创建,并且Context使用 getApplicationgContext()
 * <p>
 * 在 Activity 销毁( WebView )的时候,
 * 先让 WebView 加载null内容,然后移除 WebView,再销毁 WebView,最后置空
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener {


    private WebView web;
    private Button but;
    private Button but2;
    private WebSettings settings;
    private Button but3;




    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        but = findViewById(R.id.but);
        but2 = findViewById(R.id.but2);
        but3 = findViewById(R.id.but3);
        web = findViewById(R.id.web);




        but.setOnClickListener(this);
        but2.setOnClickListener(this);
        but3.setOnClickListener(this);


        //声明WebSettings子类
        settings = web.getSettings();
        //如果访问的页面中要与Javascript交互,则webview必须设置支持Javascript
        settings.setJavaScriptEnabled(true);
        //设置自适应屏幕,两者合用
        settings.setUseWideViewPort(true); //将图片调整到适合webview的大小
        settings.setLoadWithOverviewMode(true); // 缩放至屏幕的大小
        // 设置与Js交互的权限
        settings.setJavaScriptEnabled(true);
        // 设置允许JS弹窗
        settings.setJavaScriptCanOpenWindowsAutomatically(true);
        // 先载入JS代码

        // 复写shouldOverrideUrlLoading()方法,使得打开网页时不调用系统浏览器, 而是在本WebView中显示
        web.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });




        // 由于设置了弹窗检验调用结果,所以需要支持js对话框
        // webview只是载体,内容的渲染需要使用webviewChromClient类去实现
        // 通过设置WebChromeClient对象处理JavaScript的对话框
        //设置响应js 的Alert()函数(回调方法)
        web.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, final JsResult result) {
                AlertDialog.Builder b = new AlertDialog.Builder(MainActivity.this);
                b.setTitle("Alter");
                b.setMessage(message);
                b.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        result.confirm();
                    }
                });
                b.setCancelable(false);
                b.create().show();
                return true;
            }
        });










    }


    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            //获取本地html文件
            case R.id.but:
                web.loadUrl("file:///android_asset/index.html");
                break;
            //与js交互
            case R.id.but2:


                web.post(new Runnable() {
                        @Override
                        public void run() {
                            // 格式规定为:file:///android_asset/文件名.html
                            web.loadUrl("file:///android_asset/webview.html");
                            web.loadUrl("javascript:callJs()");


                        }
                    });




                break;
            case R.id.but3:
                web.loadUrl("http://www.baidu.com/");


                break;


        }




    }




    //销毁
    @Override
    protected void onDestroy() {
        if (web != null) {
            web.loadDataWithBaseURL(null, "", "text/html", "utf-8", null);
            web.clearHistory();


            ((ViewGroup) web.getParent()).removeView(web);
            web.destroy();
            web = null;
        }


        super.onDestroy();
    }
}


xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.webview_js.MainActivity">


    <Button
        android:id="@+id/but"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="点我调用本地html文件" />


    <Button
        android:text="点我调用网站"
        android:id="@+id/but3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />


    <Button
        android:id="@+id/but2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="点我与Js交互" />


    <WebView
        android:id="@+id/web"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></WebView>




</LinearLayout>


html文件(js):
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			
			function callJs(){
				alert("android调用了JS的call方法")
			}
			
		</script>
	</head>
	<body>
		
		
	</body>
</html>
로그인 후 복사
related 권장 사항 :


ajax () 및 배경 상호 작용 단계에 자세한 설명 jsbridge 간의 자세한 설명 jsbridge

Ajax+PHP

를 사용한 데이터 상호작용 구현

위 내용은 Android와 JS 간의 간단한 상호작용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿