jquery收集页面参数生成xml,用于与server做数据交互
本博客是自己在学习和工作途中的积累与总结,仅供自己参考,也欢迎大家转载,转载时请注明出处。
http://www.cnblogs.com/king-xg/p/6382603.html
通过jquery来手机页面隐藏域或含有name属性的input标签值,生成XML字符串传送到服务器,可通过dom4j的xml解析技术进行参数获取
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="js/jquery-1.8.2.js" ></script>
<title>页面参数收集插件</title>
<script type="text/javascript"> function clickBT(){
var str = collect();
$("#text").text(str);
} function collect(){
var head = '<?xml version="1.0" encoding="UTF-8"?>';
var root = $("<root></root>");
var arr = $(document).find(":input[type='hidden'][path],:text[path],:hidden[path],:password[path],input[path],span[path],textarea[path],select[path]");
var xml = "";
for(var i = ; i < arr.length; i ++){
if(i+ >= arr.length){
xml = splitArr($(arr[i]),root);
break;
}
splitArr($(arr[i]),root);
}
return (head+"<root>"+xml+"</root>"); } function splitArr(obj,root){
var path = obj.attr('path').toLowerCase();
// 拆分path
var paths = path.split("/");
var reg = /\[[A-Za-z0-]+\]/;
var pnode = root;
for(var i = ; i < paths.length;i ++){
if(reg.test(paths[i])){
var tagName = paths[i].substring(,paths[i].indexOf('['));
var index_str = paths[i].substring(paths[i].indexOf('[')+,paths[i].indexOf(']'))
var index = parseInt(index_str);
// 存在[],多层次节点
// 判断是否存在该索引的节点
if(pnode.children(tagName).length < index+){
// 不存在该标签
var node = $("<"+tagName+">"+"</"+tagName+">");
pnode.append(node);
pnode = node;
}else{
// 存在该标签
pnode = pnode.children(tagName).eq(index);
}
}else{
// 不存在[]
// 判断是否存在该标签
if(pnode.children(paths[i]).length==){
pnode = pnode.children(paths[i]).eq();
}else{
// 打印错误
if(pnode.children(paths[i]).length>){
throw new Error("标签:"+paths[i]+"--存在多层次节点");
return null;
}
var node = $("<"+paths[i]+">"+"</"+paths[i]+">");
pnode.append(node);
// 初始化pnode
pnode = node;
}
}
}
//pnode.text("<![CDATA["+obj.val()+"]]>");
pnode.text(obj.val());
return root.html();
} </script>
</head>
<body>
<input type="hidden" path="project/persons/person[0]/name" value="king"/>
<input type="hidden" path="project/persons/person[0]/age" value=""/> <input type="hidden" path="project/persons/person[1]/name" value="arise"/>
<input type="hidden" path="project/persons/person[1]/age" value=""/> <input path="project/base_info/project_name" value="功能性项目"/>
<input path="project/base_info/create_time" value="2017-02-07"/> <input type="text" path="project/base_info/money" value="" />
<input type="text" value="xxx" /> <textarea path="project/base_info/msg">king</textarea> <select id="sele" path="second_message/sec_msg">
<option></option>
<option></option>
<option></option>
<option></option>
</select> <span path="message/text">it is only text!</span> <input path="project/books/book[0]/menu/section[0]" value="章节0"/>
<input path="project/books/book[0]/menu/section[1]" value="章节1"/>
<input path="project/books/book[1]/menu/section[0]" value="</section>"/>
<input path="project/books/book[1]/menu/section[1]" value="章节1"/>
<input path="project/books/book[2]/menu/section[0]" value="章/r/n节0"/>
<input path="project/books/book[2]/menu/section[1]"/>
<input path="project/books/book[2]/menu/section[2]" value="章节2"/>
<input type="button" name="collection" value="collect" onclick="javascript:clickBT()" /> <textarea id="text" style="width: 500px;height: 400px;"></textarea>
</body>
</html>
若有不足之处,还望指出!
jquery收集页面参数生成xml,用于与server做数据交互的更多相关文章
- QtQuick多页面切换、多页面切换动画、多个qml文件数据交互
一.QtQuick多页面切换方法 (1)“隐藏法” 前一个视图visible设为false或者透明度opacity设为0,相当于“隐藏”了,实际还存在: 要显示的视图visible设为true或者透明 ...
- 利用Java.util.UUID来生成唯一ID(用来做数据库主键好用)
UUID(Universally Unique Identifier)全局唯一标识符,是指在一台机器上生成的数字,它保证对在同一时空中的所有机器都是唯一的.按照开放软件基金会(OSF)制定的标准计算, ...
- 【转】以XML文件方式保存用户数据——2013-08-25 22
正在做项目中有很多游戏数据要保存,常见的玩家数据这些比较简单的可以用CCUserDefault.它是cocos2d-x用来存取基本数据类型用的.保存为XML文件格式. 主要方法:(和java的map很 ...
- MUI框架-10-MUI 数据交互-跳转详情页面
MUI框架-10-MUI 数据交互-跳转详情页面 上一篇介绍了如何实现数据交互,给别人的 API 发送 ajax 请求,我们得到数据,再使用 art-template 模板引擎拼接 HTML,最终实现 ...
- Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面
一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...
- jQuery ajax() 参数,回调函数,数据类型,发送数据到服务器,高级选项
$.ajax({ options:/*类型:Object; 可选.AJAX 请求设置.所有选项都是可选的.*/ async:/*类型:Boolean; 默认值: true.默认设置下,所有请求均为异 ...
- jquery 实现页面局部刷新ajax做法
这个方法就多了去了,常见的有以下几种:下面介绍全页面刷新方法:有时候可能会用到 window.location.reload()刷新当前页面. parent.location.reload()刷新父亲 ...
- 大数据技术之_25_手机APP信息统计系统项目_01_APP 数据生成模块 + 数据收集模块 + 数据处理模块框架搭建 + 业务需求处理 + 数据展示模块 +项目总结 + 问题总结
一 项目概述1.1 角色1.2 业务术语1.3 项目效果展示二 项目需求三 项目概要3.1 项目技术架构3.2 项目目录结构3.3 项目技术选型3.4 项目整体集群规划3.5 创建项目工程四 APP ...
- java 解析并生成 XML
在 java 中使用 Dom4j 解析 XML 对 XML 文件的解析,通常使用的是 Dom4j 和 jdom 作为XML解析工具. 在此只介绍下 Dom4j 对 XML 文件的解析使用方法. 1. ...
随机推荐
- Fluent Python: memoryview
关于Python的memoryview内置类,搜索国内网站相关博客后发现对其解释都很简单, 我觉得学习一个新的知识点一般都要弄清楚两点: 1, 什么时候使用?(也就是能解决什么问题) 2,如何使用? ...
- 第二次c艹作业
1,c语言实现方法:按照电梯运行方式,改变被定义为全局变量的结构体的数值. c艹实现方法:用类来存放电梯的属性,整个过程都是对类操作. 两者不同:c语言是面向过程的,整个函数里都要对电梯的参数进行修改 ...
- Ubuntu命令行安装显卡驱动
1. sudo apt-et purge nvidia* 卸载原有驱动 2. sudo add-apt-repository ppa:graphics-drivers sudo apt-get upd ...
- Alpha-8
前言 失心疯病源8 团队代码管理github 站立会议 队名:PMS 530雨勤(组长) 今天完成了那些任务 20:00~23:00 代码整合,已形成可用模块,但还需适应场景局部优化 代码签入gith ...
- lintcode-422-最后一个单词的长度
422-最后一个单词的长度 给定一个字符串, 包含大小写字母.空格' ',请返回其最后一个单词的长度. 如果不存在最后一个单词,请返回 0 . 注意事项 一个单词的界定是,由字母组成,但不包含任何的空 ...
- texbbox,combobox设置属性
--输入框 $("#xx").textbox('setValue','value'); //设置输入框的值 $('#xx').textbox('textbox').attr('r ...
- java沙盒入门(2)
Java在Internet上的应用已经日渐普遍,使用在网页上的Java程序称之为applet,利用Applet的嵌入能够使原本静态的HTML富有变化,并且能够做到"声"." ...
- jQuery之过滤元素
还是那句话,这些知识一个小小的练习,更多的请看jQuery手册 在jQuery对象中的元素对象数组中过滤出一部分元素来1. first()2. last()3. eq(index|-index)4. ...
- JavaScript设计模式学习之路——面向对象的思想
今天,我拿到了张容铭写的这本<JavaScript设计模式>这本书,开始了关于JavaScript更深一点的学习. 看到这本书开始的时候,虽然之前通过看书.一些比较好的视频的讲解,对Jav ...
- Charles安装及使用教程
一. 简介及安装 一.charles的使用 1.1 charles的说明 Charles其实是一款代理服务器,通过过将自己设置成系统(电脑或者浏览器)的网络访问代理服务器,然后截取请求和请求结果达到 ...