云报表XDOC:带参数的HTML

2024-01-28 01:18
文章标签 参数 html frontend 报表 xdoc

本文主要是介绍云报表XDOC:带参数的HTML,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

  HTML中可以支持参数(如果没有就不能叫报表了),参数的引用方式为:${参数名称},参数的传递方式为json方式,如下:
var  html =  "<html><h1>${公司}</h1><img src='${徽标}'></html>" ;
XDoc.run(html, "flash" ,{公司: "新浪" ,徽标: "http://i1.sinaimg.cn/dy/deco/2013/0329/logo/LOGO_1x.png" }, "_blank" );


 
X DOC还可以使用“_xdata”参数传递批量数据,例如:
XDoc.run(html, "flash" ,
  {_xdata:[
    {公司: "新浪" ,徽标: "http://i1.sinaimg.cn/dy/deco/2013/0329/logo/LOGO_1x.png" },
    {公司: "百度" ,徽标: "http://www.baidu.com/img/bdlogo.gif" },
    {公司: "腾讯" ,徽标: "http://mat1.gtimg.com/www/images/qq2012/qqlogo_1x.png" },
    {公司: "阿里巴巴" ,徽标: "http://i04.c.aliimg.com/cms/upload/2012/625/674/476526_1451252140.jpg" }
  ]}
  , "_blank" );


 
完整的示例html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>XDOC Server</title>
</head>
<body>
<script type="text/javascript" src="http://xdoc.sinaapp.com/xdoc.js"></script>
<script type="text/javascript">
var html = "<html><h1>${公司}</h1><img src='${徽标}'></html>";
//XDoc.run(html,"flash",{公司:"新浪",徽标:"http://i1.sinaimg.cn/dy/deco/2013/0329/logo/LOGO_1x.png"},"_blank");
XDoc.run(html,"flash",{_xdata:[{公司:"新浪",徽标:"http://i1.sinaimg.cn/dy/deco/2013/0329/logo/LOGO_1x.png"},{公司:"百度",徽标:"http://www.baidu.com/img/bdlogo.gif"},{公司:"腾讯",徽标:"http://mat1.gtimg.com/www/images/qq2012/qqlogo_1x.png"},{公司:"阿里巴巴",徽标:"http://i04.c.aliimg.com/cms/upload/2012/625/674/476526_1451252140.jpg"}]},"_blank");
</script></body>
</html>
 

这篇关于云报表XDOC:带参数的HTML的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/652061

相关文章

前端高级CSS用法示例详解

《前端高级CSS用法示例详解》在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交互和动态效果的关键技术之一,随着前端技术的不断发展,CSS的用法也日益丰富和高级,本文将深... 前端高级css用法在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交

Python将博客内容html导出为Markdown格式

《Python将博客内容html导出为Markdown格式》Python将博客内容html导出为Markdown格式,通过博客url地址抓取文章,分析并提取出文章标题和内容,将内容构建成html,再转... 目录一、为什么要搞?二、准备如何搞?三、说搞咱就搞!抓取文章提取内容构建html转存markdown

在React中引入Tailwind CSS的完整指南

《在React中引入TailwindCSS的完整指南》在现代前端开发中,使用UI库可以显著提高开发效率,TailwindCSS是一个功能类优先的CSS框架,本文将详细介绍如何在Reac... 目录前言一、Tailwind css 简介二、创建 React 项目使用 Create React App 创建项目

vue使用docxtemplater导出word

《vue使用docxtemplater导出word》docxtemplater是一种邮件合并工具,以编程方式使用并处理条件、循环,并且可以扩展以插入任何内容,下面我们来看看如何使用docxtempl... 目录docxtemplatervue使用docxtemplater导出word安装常用语法 封装导出方

Vue中组件之间传值的六种方式(完整版)

《Vue中组件之间传值的六种方式(完整版)》组件是vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用,针对不同的使用场景,如何选择行之有效的通信方式... 目录前言方法一、props/$emit1.父组件向子组件传值2.子组件向父组件传值(通过事件形式)方

css中的 vertical-align与line-height作用详解

《css中的vertical-align与line-height作用详解》:本文主要介绍了CSS中的`vertical-align`和`line-height`属性,包括它们的作用、适用元素、属性值、常见使用场景、常见问题及解决方案,详细内容请阅读本文,希望能对你有所帮助... 目录vertical-ali

一文带你了解SpringBoot中启动参数的各种用法

《一文带你了解SpringBoot中启动参数的各种用法》在使用SpringBoot开发应用时,我们通常需要根据不同的环境或特定需求调整启动参数,那么,SpringBoot提供了哪些方式来配置这些启动参... 目录一、启动参数的常见传递方式二、通过命令行参数传递启动参数三、使用 application.pro

基于@RequestParam注解之Spring MVC参数绑定的利器

《基于@RequestParam注解之SpringMVC参数绑定的利器》:本文主要介绍基于@RequestParam注解之SpringMVC参数绑定的利器,具有很好的参考价值,希望对大家有所帮助... 目录@RequestParam注解:Spring MVC参数绑定的利器什么是@RequestParam?@

浅析CSS 中z - index属性的作用及在什么情况下会失效

《浅析CSS中z-index属性的作用及在什么情况下会失效》z-index属性用于控制元素的堆叠顺序,值越大,元素越显示在上层,它需要元素具有定位属性(如relative、absolute、fi... 目录1. z-index 属性的作用2. z-index 失效的情况2.1 元素没有定位属性2.2 元素处

Python实现html转png的完美方案介绍

《Python实现html转png的完美方案介绍》这篇文章主要为大家详细介绍了如何使用Python实现html转png功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 1.增强稳定性与错误处理建议使用三层异常捕获结构:try: with sync_playwright(