gpt4 book ai didi

javascript - 使用 webView 时是否可以将 HTML 表单中的数据获取到 android 中?

转载 作者:IT王子 更新时间:2023-10-28 23:29:39 27 4
gpt4 key购买 nike

我在 HTML 中制作了一个非常简单的表单,在 android 中使用 webview 进行查看,该 webview 使用文本框输入您的姓名,当您单击按钮时,它会将其显示为一个段落,并使用 html 和javascript。这是我的html代码:

<!DOCTYPE html>
<html>
<body>
<p> Write your name and win your favorite game console name and win it! The winners will be announced in 4 days.</p>
Type your name here: <input id="thebox" type="text" name="value" value=""><br>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
var x = document.getElementById("thebox").value;
document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

新的编辑表格

<form name="albert" action="" method="POST">

<label for="firstname"> First Name </label>
<br /><br />

<input type="text" name="firstname" id="firstname" />

<input type="submit" name="sbumit" value="Submit" />


</form>

我想在按钮单击时从 android 中的变量中名为“thebox”的输入框中获取值,我之前尝试了很多东西,我遵循了一种注入(inject) JS 文件的方法,但因为我对此一无所知JS 所以我确实失败了,这是我放在我的项目中的文件,该文件名为inject.js:

document.getElementsByTagName('form')[0].onsubmit = function () {
var objPWD, objAccount, objSave;
var str = '';
var inputs = document.getElementsByTagName('thebox');
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].name.toLowerCase() === 'thebox') {
objAccount = inputs[i];
}
}
if(objAccount != null) {
str += objAccount.value;
}
if(objPWD != null) {
str += ' , ' + objPWD.value;
}
if(objSave != null) {
str += ' , ' + objSave.value;
}
window.AndroidInterface.processHTML(str);
return true;
};

后来当我关注那篇文章时,它说我需要在我的 MainActivity 中放一些东西,但由于我是第一次使用 webview,所以我不太了解,下面是我放入 MainActivity 的代码:

 @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
WebView webView = new WebView(this);
this.setContentView(webView);

// enable javascript
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.addJavascriptInterface(new JavaScriptInterface(), "AndroidInterface");

// catch events
webView.setWebViewClient(new WebViewClient(){
@Override
public void onPageFinished(WebView view, String url) {
try {
view.loadUrl("javascript:" + buildInjection());
} catch (IOException e) {
e.printStackTrace();
}
}
});

webView.loadUrl("http://someurl.com");
}

我在 MainActivity 中创建的嵌套类:

class JavaScriptInterface {
@JavascriptInterface
public void processHTML(String formData) {
Log.d("AWESOME_TAG", "form data: " + formData);
}
}

最后是注入(inject)代码的方法:

private String buildInjection() throws IOException {
StringBuilder buf = new StringBuilder();
InputStream inject = getAssets().open("inject.js");// file from assets
BufferedReader in = new BufferedReader(new InputStreamReader(inject, "UTF-8"));
String str;
while ((str = in.readLine()) != null) {
buf.append(str);
}
in.close();

return buf.toString();
}

我想从我在 Android 的 web View 中显示的 html 表单(输入框)中获取值(value),是否真的有可能做到这一点,如果可以,请解释一下?谢谢,也请告诉我将在哪个变量中获得值。

最佳答案

    Webview browser=(WebView)view.findViewById(R.id.webChart);
browser.getSettings().setJavaScriptEnabled(true);
browser.addJavascriptInterface(new WebAppInterface(getActivity()), "Android");
browser.loadUrl("file:///android_asset/yourHtmlFileName.html");

添加这个接口(interface)类,WebAppInterface

public class WebAppInterface {
Context mContext;
String data;

WebAppInterface(Context ctx){
this.mContext=ctx;
}


@JavascriptInterface
public void sendData(String data) {
//Get the string value to process
this.data=data;
}
}

您的 HTML 代码数据

 function loadChartData() {
var x = document.getElementById("thebox").value;
Android.sendData(x);
}

在android webview中点击html按钮时调用该函数

更新

1) 默认情况下,javascript 在 webview 中是禁用的。要启用它,请获取 webview 的设置并调用 setJavaScriptEnabled(true);为真。

2)要在你的Javascript代码和你的android代码之间创建接口(interface),你需要创建Javacript接口(interface)类。

3) 将你的javascript代码和android代码之间的接口(interface)绑定(bind),你需要传递接口(interface)类的引用和你的javascript可以调用的接口(interface)名称来访问该类。

4) 传递 html 文件路径以加载到 webview(浏览器)中。

5) 创建如下界面类(WebAppInterface)。

查看此链接了解更多详情 https://developer.android.com/guide/webapps/webview.html

6) 在 HTML 文件中,创建按钮并将点击监听器添加到该按钮并使用接口(interface)名称调用 sendData("your value") 函数(此处为 Android)。

仅此而已。您可以将值从 html 传递到您的 android 代码。

关于javascript - 使用 webView 时是否可以将 HTML 表单中的数据获取到 android 中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40889152/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com