bex5 文档上传用什么组件_框架

、文件传面：

（1）Uploadify简单说基于Jquery款文件传插件

（2）Pluploadweb浏览器界面友文件传模块显示传进度、图像自缩略传块同传文件

二、图表制作面：

（1）D3js 基于数据 *** 作文档JavaScript库D3帮助使用HTMLSVGCSS展现数据D3需要使用某特定框架重点于主流浏览器兼容同结合强虚拟化组件数据驱式 *** 作DOMD3支持主流浏览器包括IE8及前版本D3测试Firefox、Chrome、Safari、OperaIE9D3部组件旧浏览器运行

（2）JSCharts 款免费源JavaScript图表脚本库支持XML数据格式帮助用户快速创建各类图表需具备相应技术知识甚至用 *** 作些繁琐专业工具省省力

三、Jquery ui面：

（1）Chico UI jQuery UI Chico UI 包含 auto-complete, blink, carousel, countdown, date-picker, dropdown, expand, calendar 等诸逐渐同提供 CSS 布局框架用于实现网页布局表格

（2）jQuery UI[1] jQuery 基础源 JavaScript 网页用户界面代码库包含底层用户交互、画、特效更换主题视控件我直接用构建具交互性web应用程序所插件测试能兼容IE 60+, Firefox 3+, Safari 31+, Opera 96+, GoogleChrome

四、表格组件面：

（1）Flexigrid类似于Ext Gird基于jQuery发Grid具功能包括：调整列宽合并列标题页排序显示/隐藏表格等Flexigrid显示数据能够通Ajax获取或者普通表格转换

（2）ParamQuery grid轻量级jQuery网格插件基于用于用户界面控制、具致API优秀设计模式jQueryUI Widget factory创建能够网页展示各种类似于ExcelGoogle Spreadsheet效网格

本文重点介绍如何入门使用

工具/原料

Flexigrid 插件包

eclipse/Myeclipse/Visual Studio

方法/步骤

百度搜索jQuery Flexigrid 表格插件官网，进入之后如图

点击官网DownLoad进入Flexigrid 的GitHub主页，下载插件包

解压刚刚下载插件包，查看目录：

READMEmd 里面介绍了当前版本的一些特性和证书等信息

Css目录存放该插件需要的样式表，

Js目录存放插件的js文件

Demo即为作者提供的一些使用例子

使用：

(1)在插件包中自带了，几个例子，读者可以借鉴下:里面介绍了不同数据格式（如：JSON，XML）如何绑定到flexgrid表格中，具体参考源代码学习

(2)如何根据自定义需求向表格中插入数据及控件

下面给出一个简单例子：需求如下图

步骤：a、利用eclipse/Myeclipse或Visual Studio(具体用什么工具根据喜好，也可以只用文本编辑器)创建一个web工程

b、工程中添加jquery插件，Flexigrid 插件

c、新建TestFlexigridhtml页面进行编辑,html代码为：

<!DOCTYPE html>

<html>

<head>

<title>Test Flexigrid</title>

</head>

</table>

</body>

</html>

js部分代码：

function init() {

$('#tb_account1')flexigrid({

'url': false

, 'width': 500

, 'dataType': 'json'

, 'colModel': [

{ 'display': 'Name', 'name': 'Name', 'width': 100, 'sortable': false, 'align': 'left', 'dataAlign': 'left' }

, { 'display': 'Age', 'name': 'Age', 'width': 100, 'sortable': false, 'align': 'left', 'dataAlign': 'left' }

, { 'display': 'Option', 'name': 'Option', 'width': 300, 'sortable': false, 'align': 'left', 'dataAlign': 'left' }

]

, 'resizable': false

, 'striped': true

, 'singleSelect': true

, 'showToggleBtn': false

, 'minheight': 30

, 'height': 150

, 'preProcess': function (data) {

return data;

}

, 'doDbClick': function () {

}

});

var tbData1 = { 'total': 1, 'rows': [] };

for (var i = 0; i < 4; i++) {

tbData1['rows']push({ 'cell': ["name", "10", "<button>Add</button> <button>Modify</button>"] });

}

$('#tb_account1')flexAddData(tbData1);

}

</script>

最终界面显示效果如下；

以上仅简单介绍Flexigrid插件下载使用，在实际应用中会根据具体业务要求做调整，读者可自行深入研究

以上就是关于bex5 文档上传用什么组件全部的内容，包括:bex5 文档上传用什么组件、如何快速入门jQuery Flexigrid 表格插件、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

原文地址:https://54852.com/web/9582402.html

bex5 文档上传用什么组件

发表评论

评论列表（0条）

bex5 文档上传 用什么组件

发表评论

评论列表（0条）

bex5 文档上传用什么组件