`

android webview内嵌网页js解析json 并根据json数据生成表单以及radio的样式问题

 
阅读更多

        在开发android app时,常常碰到新闻客户端的开发,新闻客户端的新闻详细页面很可能是一个html,android端需要用webview来展示,但是如果需要webview与android端相互调用,都会用到js与android端的相互调用,但是如果要传递一个json数据到webview,调用网页的js来解析json获取数据来调用相关的方法,那就需要js解析json。

      js解析json,我用的是eval函数。

function initToupiaoTest() {
 //date是手机端传递过来的对象,get获取一个json
 var str = eval("("+datas.getTestJson().toString()+")");
  var main = str['main'],questions = str['questions'];

  for(var i=0;i< questions.length;i++)
  {
   console.log('hello : ******测试**** >>>>>>>>> = '+questions[i]._id);
  
   for(var j=0;j<questions[i].answers.length;j++)
   {
    //alert(questions[i].answers[j].title)//拿到answers的元素
    console.log('hello : ******测试**** >>>>>>>>> = '+questions[i].answers[j].title); 
   }
  }

}

 //模拟数据

var str = '{"main":{"_id":"xxx","catid":"1707","description":"","exit_content":"","exit_title":"","exit_url":"","status":10,"sub_title":"","title":"list\u6d4b\u8bd5","checkresult":0},"questions":[{"_id":"xxx","title":"Q2\uff1a","type":"radio","is_required":"1","answers":[{"_id":"xxx","title":"A.","hits":15},{"_id":"xxx","title":"B.","hits":11}]},{"_id":"xxx","title":"Q1\uff1a","type":"radio","is_required":"1","answers":[{"_id":"xxx","hits":12,"title":"titleA."},{"_id":"xxx","hits":17,"title":"titleB."}]}]}';

 

 //生成表单

 

<div id="toupiao">

    <h4>

        <span></span>

        <P style="color:#ffffff;background-image: url(bluel.png);font-family: '微软雅黑';" id="q_title">您觉得这次改版如何</p>

        <span></span>

    </h4>

<form >

<div id="qlist">

<!-- 这里是生成表单内容-->

 

</div>

 

 

 

<div style="width:100%;text-align:center;"><input type="button" name="aa" style="color:#ffffff;background-image: url(bluel.png);width:80%;line-height:38px;height:38px;font-family: '微软雅黑';" value="显示投票结果"  onClick="hi()"/></div>

</form>

</div>

 

 

//js代码

var main = str['main'],questions = str['questions'],htmlArr = new Array();

 

 

for(var i=0;i< questions.length;i++)

{

//alert(questions[i]._id)//拿到questions的元素

 

htmlArr.push('<p style="font-weight:bold;" id="'+questions[i]._id+'">'+questions[i].title+'</p>');

 

for(var j=0;j<questions[i].answers.length;j++)

{

//alert(questions[i].answers[j].title)//拿到answers的元素

 

htmlArr.push('<label class="input"><input type="radio" name="aa" id="'+questions[i]._id+'">&nbsp;'+questions[i].answers[j].title+'</label><br>');

}

}

document.getElementById('qlist').innerHTML = htmlArr.join('');

 

如果展示的radio样式有问题,在webview中展示为一条下划线,那么在代码中注释掉如下代码

/*mWebview.getSettings().setLayoutAlgorithm(

WebSettings.LayoutAlgorithm.SINGLE_COLUMN);*/  

 

 

 

 

 

 

 

 

分享到:
评论

相关推荐

    JS调用Android方法,向Android方法传递json数据

    本文将深入探讨如何使用JavaScript调用Android的方法,并传递JSON数据,以实现两者之间的高效通信。 首先,我们需要了解`Android WebView`。WebView是Android系统提供的一种组件,它能够加载并显示网页内容,就像是...

    Android应用内嵌网页WebView

    在Android应用开发中,内嵌WebView是一个非常常见的需求,它允许开发者在应用程序中展示网页内容。WebView组件是Android SDK提供的一种原生控件,能够直接在应用内部加载和显示HTML、CSS以及JavaScript等内容,极大...

    Android webview加载网页.zip

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序内部加载和显示网页内容,无需跳转到外部浏览器。这个“Android webview加载网页.zip”文件可能包含了一个示例项目或者教程,帮助开发者理解...

    android webview播放网页视频

    总的来说,Android Webview播放网页视频涉及的关键点包括:开启JavaScript支持、实现WebChromeClient、处理全屏视频以及管理应用的生命周期。通过这些步骤,我们可以使Webview成功地在Android应用中加载和播放网页...

    android Webview读取网页里的所有图片,并实现点击放大

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序中加载和显示网页内容。当涉及到用户界面交互,特别是展示包含图片的网页时,我们可能需要实现一些额外的功能,比如点击图片放大查看。本篇文章...

    Android WebView 去除标题

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序中加载和显示网页内容。有时候,我们可能希望去除WebView中的标题部分,以实现更自定义化的界面设计。本篇文章将详细探讨如何在Android的...

    Android WebView加载网页以及本地图片缓存问题

    本文将深入探讨如何使用WebView加载网页以及本地图片,并解决缓存问题。 一、WebView的基本使用 1. 初始化WebView:首先,我们需要在布局XML文件中添加WebView组件,并在对应的Activity或Fragment中找到该组件。...

    Android WebView交互传递json字符串并解析的方法

    但是WebView也可以传递一种很重要很常用的数据格式-json数据. 传递json和传递String数据是一样的,关键就是HTML5端对json数据通过eval&#40;&#41;函数进行解析 传递过程中android端调用的最重要的一个函数就是: ...

    实例详解Android Webview拦截ajax请求

    Android Webview 拦截 Ajax 请求的详细讲解 Android Webview 提供了页面加载及资源请求的钩子,但是对于 H5 的 Ajax 请求并没有提供干涉的接口。这意味着我们不能在 Webview 中干涉 JavaScript 发起的 HTTP 请求,...

    Android WebView 实现缓存网页数据

    在Android开发中,`WebView` 是一个非常重要的组件,它允许开发者在应用程序内嵌入一个浏览器,用于显示网页内容。本篇文章将详细讲解如何利用 `WebView` 实现网页数据的缓存,使得在网络不稳定或者断开的情况下,...

    Android解析XML使用WebView显示

    在Android开发中,有时我们需要将XML数据解析并展示在用户界面上,这通常可以通过WebView来实现,因为它可以加载HTML页面并展示丰富的Web内容。在这个场景中,XML数据被解析成JSON格式,然后在WebView中渲染。以下是...

    Android webview与js交换JSON对象数据示例

    本文将详细介绍如何在Android的Webview中与JavaScript交换JSON对象数据,特别是当JavaScript需要调用Android对象并接收JSON返回值时。 首先,为了让Webview能够执行JavaScript代码,我们需要启用JavaScript支持。在...

    android webview 加载网页 样例

    本文将深入探讨如何使用Android WebView加载网页,包括基本使用、配置设置、与JavaScript交互以及处理网络权限等问题。 一、WebView基础 1. 添加依赖 在Android Studio项目中,首先确保在`build.gradle`(Module)...

    android webview模拟网页post操作

    在Android开发中,WebView是一个非常重要的组件,它允许在应用程序中加载和显示网页内容,同时提供了与网页交互的能力。其中一个常见的需求就是通过WebView模拟网页的POST操作,这通常用于实现登录功能、表单提交等...

    android不使用webview与js交互

    在Android开发中,Webview通常被用来加载网页内容并实现应用程序与网页之间的交互。然而,有时我们可能有需求在不依赖Webview的情况下实现Android应用与JavaScript的交互。本文将深入探讨这种非Webview方式的交互...

    android 使用webview、js生成图表

    在本文中,我们将深入探讨如何在Android应用中使用Webview与JavaScript结合生成图表,这通常用于数据可视化,使得用户能够更直观地理解应用程序中的数据。 一、Webview基础 1. Webview引入:在AndroidManifest.xml...

    Android webview与js交互

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序中内嵌网页内容。通过WebView,我们可以展示HTML、CSS和JavaScript构建的网页,同时还能实现Android应用与网页内容的交互。本节我们将深入探讨...

    Android WebView获取源码

    本文将详细介绍如何在Android中使用`WebView`来获取网页的源码,并封装成一个自定义的`ArthurWebView`组件。 首先,我们了解`WebView`的基本用法。`WebView`继承自`View`,主要通过以下步骤进行初始化: 1. 在布局...

    android的webView的登录实例

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序中加载和显示网页内容。本实例将详述如何使用Android Studio 3.1.2版本,通过WebView来创建一个简单的登录界面,该界面使用本地HTML页面进行...

Global site tag (gtag.js) - Google Analytics