首页 > 编程语言 >Android中Java和JS调用对方方法的简介

Android中Java和JS调用对方方法的简介

时间:2023-02-01 12:31:29浏览次数:47  
标签:调用 Java js JS id layout Android main android


A Java 调用 Js 的方法

  • 无参:使用WebView控件loadUrl()方法,传入​"javascript:jsMethod()"​即可调用​jsMethod()​方法
  • 带参:同上,并将参数加上即可"javascript:jsMethodWithArg(" + args参数 + ")"

B Js 调用 Java 的方法

  • 使用WebView控件的addJavascriptInterface()方法,传入一个Object对象和一个String标记(Js通过该标记调用Object对象内写好的方法)
  • 关于带不带参数,即Object内的方法和Js调用时配合定义好参数格式,准确传入即可

C 完整案例

  1. html + Js
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript">

/*js通过Java给的String标记:Catface调用Java中Object内定义的方法*/
function jsCallJavaWithArgs(text) {
Catface.showToast(text);
}

function jsCallJava() {
Catface.showToast();
}

/*java调用js方法*/
function javaCallJs(){
document.getElementById("content").innerHTML += "<br\>java调用了js函数";
}

function javaCallJsWithArgs(args){
document.getElementById("content").innerHTML += ("<br\>" + args);
}

function javaCallJsWithArgs2(args) {
var sum = 0;
for(var i = 0; i < args; i++) {
sum += i;
}
document.getElementById("content").innerHTML += ("<br\>" + sum);
}
</script>
</head>

<body>
<input type="button" value="js调用java代码(带参)" onClick="jsCallJavaWithArgs('我从js写到java上啦')" /><br/>
<input type="button" value="js调用java代码" onClick="jsCallJava()" /><br/>
<div id="content">java调用js函数_内容显示……</div>
</body>
</html>
  1. xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="@+id/bt_01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="java调用js函数" />

<Button
android:id="@+id/bt_02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="java调用js函数(带参)" />

<Button
android:id="@+id/bt_03"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="java调用js函数(带参2)" />

<WebView
android:id="@+id/wv_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
  1. Java
public class MainActivity extends Activity {
private WebView wv_main;

@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

wv_main = (WebView) findViewById(R.id.wv_main);
wv_main.getSettings().setJavaScriptEnabled(true);
wv_main.loadUrl("file:///android_asset/index.html");

findViewById(R.id.bt_01).setOnClickListener(new OnClickListener() {
@Override public void onClick(View v) {
wv_main.loadUrl("javascript:javaCallJs()");
}
});
findViewById(R.id.bt_02).setOnClickListener(new OnClickListener() {
@Override public void onClick(View v) {
wv_main.loadUrl("javascript:javaCallJsWithArgs(" + "'我从java写到js上啦'" + ")");
}
});
findViewById(R.id.bt_03).setOnClickListener(new OnClickListener() {
@Override public void onClick(View v) {
wv_main.loadUrl("javascript:javaCallJsWithArgs2(" + 10 + ")");
}
});

// arg1:Object对象;arg2:String标记
wv_main.addJavascriptInterface(new JavaMethod(this), "Catface");
}

public class JavaMethod {
Context ctx;

JavaMethod(Context ctx) {
this.ctx = ctx;
}

@JavascriptInterface
public void showToast(String text) {
Toast.makeText(ctx, text, Toast.LENGTH_SHORT).show();
}

@JavascriptInterface
public void showToast() {
Toast.makeText(ctx, "js调用了java代码", Toast.LENGTH_SHORT).show();
}
}
}



补1:Crosswalk中相互调用方式

  • Java调用Js方法仅修改一点点即可
xv_main.load("javascript:javaCallJs()", null);
xv_main.load("javascript:javaCallJsWithArgs2("java调用js啦")", null);
  • Js调用Java方法与原生调用同理,但需在Activity的onCreate()中添加
XWalkPreferences.setValue("enable-javascript", true);
XWalkPreferences.setValue(XWalkPreferences.REMOTE_DEBUGGING, true);

补2:Cordova + Crosswalk中相互调用方式

  • Js调用Java:在CordovaActivity中添加this.appView.addJavascriptInterface()即可,参数传递方式同上

注意​​@JavascriptInterface​​​的包类路径是:​​org.xwalk.core.JavascriptInterface​​.即Crosswalk下的API,别导错.

this.appView.addJavascriptInterface(new Object() {
@JavascriptInterface
public void showToast(String text) {
Toast.makeText(getApplicationContext(), text, Toast.LENGTH_SHORT).show();
}

@JavascriptInterface
public void showToast() {
Toast.makeText(getApplicationContext(), "js调用了java代码", Toast.LENGTH_SHORT).show();
}
}, "Catface");
  • Java调用Js
// 在CordovaActivity或者CordovaPlugin(插件)类中调用方法如下.
appView.loadUrl("javascript:compare(" + arg1 + "," + arg2 + ")");

// 在CordovaActivity的init()方法或者CordovaPlugin的onCreate()方法中务必添加,否则后果自负.
appView.loadUrl("file:///android_asset/www/index.html");
super.setIntegerProperty("loadUrlTimeoutValue", Integer.MAX_VALUE);


标签:调用,Java,js,JS,id,layout,Android,main,android
From: https://blog.51cto.com/u_15950249/6031359

相关文章