当前位置:首页 » 网页前端 » web和js互动
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

web和js互动

发布时间: 2022-05-04 00:31:25

⑴ webview与js交互的参数有没有限制

webview与js交互的参数一般是没有限制的,随便怎么传,但是由于规范,还是少传点最好

⑵ 在webview中本地代码如何与javascript进行交互,调用什么方法,以及需要注意的事

可以,只要你是用webview打开的,那么不管事远程还是本地,都可以通过webview与app的本地java代码进行交互。没有任何区别。
1、webview必须设置支持Javascript
mWebview.getSettings().setJavaScriptEnabled(true);

2、加进一个回调的代理类JavaScriptInterface,并给它一个调用的名称:ncp
mWebView.addJavascriptInterface(new JavaScriptInterface(), "ncp");
final class JavaScriptInterface {

public int callOnJs() {

return 1000;
}

public void callOnJs2(String mode) {
//TODO
}

}
3、JS页面
<script type="text/javascript">
window.onload = function(){
document.getElementById('btn_1').addEventListener('click', onBtnClick, false);
var _int_value = window.ncp.callOnJs();
alert("get int from java:" + _int_value );
}
function onBtnClick() {
window.ncp.callOnJs2("click");
}
</script>
接下来就可以调用js方法了,
1、Java调用js方法
mWebView.loadUrl("javascript:onSaveCallback()");

2、JS访问java方法

window.ncp.callOnJs2("click");

⑶ webview 与js怎样实现数据交互

对于android初学者应该都了解webView这个组件。之前我也是对其进行了一些简单的了解,但是在一个项目中不得不用webview的时候,发现了webview的强大之处,今天就分享一下使用webview的一些经验。

1、首先了解一下webview。
webview介绍的原文如下:A View that displays web pages. This class is the basis upon which you can roll your own web browser or simply display some online content within your Activity. It uses the WebKit rendering engine to display web pages and includes methods to navigate forward and backward through a history, zoom in and out, perform text searches and more.
从上面你应该了解到了基本功能,也就是显示网页。之所以我说webview功能强大是因为它和js的交互非常方便,很简单就可以实现。

2、webview能做什么?
①webView可以利用html做界面布局,虽然目前还比较少人这么使用,不过我相信当一些客户端需要复杂的图文(图文都是动态生成)混排的时候它肯定是个不错的选择。
②直接显示网页,这功能当然也是它最基本的功能。
③和js交互。(如果你的js基础比java基础好的话那么采用这种方式做一些复杂的处理是个不错的选择)。

3、如何使用webview?
这里直接用一个svn上取下的demo,先上demo后讲解。demo的结构图如下:

WebViewDemo.java

package com.google.android.webviewdemo;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.util.Log;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;

/**
* Demonstrates how to embed a WebView in your activity. Also demonstrates how
* to have javascript in the WebView call into the activity, and how the activity
* can invoke javascript.
* <p>
* In this example, clicking on the android in the WebView will result in a call into
* the activities code in {@link DemoJavaScriptInterface#clickOnAndroid()}. This code
* will turn around and invoke javascript using the {@link WebView#loadUrl(String)}
* method.
* <p>
* Obviously all of this could have been accomplished without calling into the activity
* and then back into javascript, but this code is intended to show how to set up the
* code paths for this sort of communication.
*
*/
public class WebViewDemo extends Activity {

private static final String LOG_TAG = "WebViewDemo";

private WebView mWebView;

private Handler mHandler = new Handler();

@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);
mWebView = (WebView) findViewById(R.id.webview);

WebSettings webSettings = mWebView.getSettings();
webSettings.setSavePassword(false);
webSettings.setSaveFormData(false);
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportZoom(false);

mWebView.setWebChromeClient(new MyWebChromeClient());

mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

mWebView.loadUrl("file:///android_asset/demo.html");
}

final class DemoJavaScriptInterface {

DemoJavaScriptInterface() {
}

/**
* This is not called on the UI thread. Post a runnable to invoke
* loadUrl on the UI thread.
*/
public void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
mWebView.loadUrl("javascript:wave()");
}
});

}
}

/**
* Provides a hook for calling "alert" from javascript. Useful for
* debugging your javascript.
*/
final class MyWebChromeClient extends WebChromeClient {
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
Log.d(LOG_TAG, message);
result.confirm();
return true;
}
}
}

demo.html

<html>
<script language="javascript">
/* This function is invoked by the activity */
function wave() {
alert("1");
document.getElementById("droid").src="android_waving.png";
alert("2");
}
</script>
<body>
<!-- Calls into the javascript interface for the activity -->
<a onClick="window.demo.clickOnAndroid()"><div style="width:80px;
margin:0px auto;
padding:10px;
text-align:center;
border:2px solid #202020;" >
<img id="droid" src="android_normal.png"/><br>
Click me!
</div></a>
</body>
</html>

main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>

<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/intro"
android:padding="4dip"
android:textSize="16sp"
/>

<WebView
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
/>

</LinearLayout>

4、如何交互?
①android如何调用js。
调用 形式:
mWebView.loadUrl("javascript:wave()");

其中wave()是js中的一个方法,当然你可以把这个方法改成其他的方法,也就是android调用其他的方法。
②js如何调用android。
调用形式:
<a onClick="window.demo.clickOnAndroid()">

代码中的“demo”是在android中指定的调用名称,即
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

代码中的clickOnAndroid()是“demo”对应的对象:new DemoJavaScriptInterface() 中的一个方法。
③双向交互。
当然是把前面的两种方式组合一下就可以了。

5、讲解demo。
现在你一定了解了android和js的交互了。是时候分析一些demo了,根据上面讲的你也应该比较清楚了。具体交互流程如下:
①点击图片,则在js端直接调用android上的方法clickOnAndroid();
②clickOnAndroid()方法(利用线程)调用js的方法。
③被②调用的js直接控制html。

个人总结:利用webView的这种方式在有些时候UI布局就可以转成相应的html代码编写了,而html布局样式之类有DW这样强大的工具,而且网上很多源码,很多代码片。在UI和视觉效果上就会节省很多时间,重复发明轮子没有任何意义。

⑷ Android-webview和js脚本语言交互的时候怎么获取js方法的返回值

您好,很高兴能帮助您
Android中webview和js之间的交互
1.android中利用webview调用网页上的js代码。
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true,,然后通过loadUrl就可以直接进行调用,如下所示:
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.loadUrl("javascript:test()");
2. 网页上调用android中java代码的方法
在网页中调用java代码,需要在webview控件中添加javascriptInterface。如下所示:
mWebView.addJavascriptInterface(new Object() {
public void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
Toast.makeText(Test.this, "测试调用java", Toast.LENGTH_LONG).show();
}
});
}
}, "demo");
在网页中,只需要像调用js方法一样,进行调用就可以
<div id='b'><a onclick="window.demo.clickOnAndroid()">b.c</a></div>
3. Java代码调用js并传参
首先需要带参数的js函数,如function test(str),然后只需在调用js时传入参数即可,如下所示:
mWebView.loadUrl("javascript:test('aa')");
4.Js中调用java函数并传参
首先一样需要带参数的函数形式,但需注意此处的参数需要final类型,即得到以后不可修改,如果需要修改其中的值,可以先设置中间变量,然后进行修改。如下所示:
mWebView.addJavascriptInterface(new Object() {
public void clickOnAndroid(final int i) {
mHandler.post(new Runnable() {
public void run() {
int j = i;
j++;
Toast.makeText(Test.this, "测试调用java" + String.valueOf(j), Toast.LENGTH_LONG).show();
}
});
}
}, "demo");
然后在html页面中,利用如下代码<div id='b'><a onclick="window.demo.clickOnAndroid(2)">b.c</a></div>,
即可实现调用

你的采纳是我前进的动力,
记得好评和采纳,答题不易,互相帮助,

⑸ 安卓开发webview与js交互

@JavascriptInterface public String getValue(final String str) { if(str.equals("test")){ //java中不能用==号 return "a"; } return "b";}

⑹ wkwebview与js交互异步怎么办

//用一个对象保存oc返回来的键与值 var info = {}; //调用oc原生方法,(注意这是一个异步调用) window.webkit.messageHandlers.getTicket.postMessage(null); //oc那边收到通知成功后,会去执行js里的一个全局函数,并把前端JS需要的值以键值对的方式带给前端 function getMessage(key, value) { console.log(`${key}=${value}`); info[key] = value; }。

交互(jiāo hù),汉语词语,意为:互相;彼此。在互联网中,当计算机播放某多媒体程序的时候,编程人员可以发出指令控制该程序的运行,而不是程序单方面执行下去,程序在接受到编程人员相应的指令后而相应地做出反应,这一过程及行为,我们称之为交互。

⑺ 如何实现WebView和js页面的交互

通过webView.addJavascriptInterface(Object, "name");方法可以实现,其中参数Object表示的是需要与js交互的Java代码所在的类的类名,而参数name则表示js页面用来调用Java代码时的别名.简单来说就是将Java对象和Js对象进行绑定,通过别名可以找到与之关联的Java对象.例如:

⑻ webview和js交互为什么用cordova

一、项目背景
1、项目需要支持hybrid应用,所以部分提供h5调用的通用js保存在客户端本地。优点有:访问速度快和无需额外数据流量。
2、项目主页都是h5形式,采用vue框架,支持离线缓存
3、使用CordovaWebView加载h5应用。

⑼ 如何处理webview与js之间交互

先说说android中webview控件如何调用javascript代码?
其实android中webview控件调用javascript方法还是比较简单,只需要设置webview支持javascript,然后用loadUrl调用javascript方法即可。

javascript调用android中自定义好的方法(例如: 分享)
需要给webview控件添加addJavascriptInterface方法,而这个就类似于初始化一个类对象,以及类对象里的方法。这个类对象就提供给javascript来调用。

javascript调用自定义好的JShare对象。

效果图

⑽ web前端的javascript主要用于交互吗

web前端的javascript主要用于用户交互以及事件处理。主要作用如下:

JavaScript常用来完成以下任务

1、嵌入动态文本于HTML页面

2、对浏览器事件作出响应

3、读写HTML元素

4、在数据被提交到服务器之前验证数据

5、检测访客的浏览器信息

6、控制cookies,包括创建和修改等

javascript的内部组成:

一个完整的 JavaScript 实现是由以下 3 个不同部分组成的: