目前只代码。以后补全
主要是 给开发与测试一个数据输入的页面。简单,容易编写。
1,数据节点的添加
2,数据自动化获得
3,请求自动化封装
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="../js/jquery.min.js"></script> <!--<link href="SimulationOrder.css" rel="stylesheet">--> <style type="text/css"> /*.name{*/ /*width: 100px;*/ /*text-align: right;*/ /*}*/ table{ padding: 10px; } #lock{ padding: 20px; } #user{ padding: 20px; display: none; } #unLock{ padding: 20px; display: none; } .product{ /*padding: 10px;*/ } .desr{ /*margin-top: 30px;*/ height: 40px; } </style> <script> var baseUrl = "";//接口地址 //选择要测试的功能 function chageRadio(index){ // this.checked = 'checked'; if(index ==1) { $("#lock").css("display","block"); $("#user").css("display","none"); $("#unLock").css("display","none"); } if(index ==2){ $("#lock").css("display","none"); $("#user").css("display","block"); $("#unLock").css("display","none"); } if(index ==3){ $("#lock").css("display","none"); $("#user").css("display","none"); $("#unLock").css("display","block"); } } //提交上锁请求 function submitLockTest(){ $("#contentText").innerHTML='网络或服务异常'; var postData= getPare('#contentLock',['couponCode', 'productActivityRequest']);; // var data = JSON.stringify(postData); // var data = '{"appId":100000034,"couponId":11,"receiveUser":"12314432413"}'; $.ajax({ type : "POST", url: baseUrl+"/lock", dataType: "json", data: postData, //mimeType : "application/json", headers: {'Content-Type': 'application/json'}, success: function(msg){ console.log(msg); var jsondata= JSON.stringify(postData); $("#contentText").html(jsondata); }, error:function(XMLHttpRequest, textStatus, errorThrown){ console.log('网络或服务异常'); $("#contentText").html('提交上锁请求异常'); } }); } //提交支付成功请求 function submitUserTest(){ var postData= getPare('#user',['couponCode']);; $.ajax({ type : "POST", url: baseUrl+"user", dataType: "json", data: postData, //mimeType : "application/json", headers: {'Content-Type': 'application/json'}, success: function(msg){ console.log(msg); var jsondata= JSON.stringify(postData); $("#contentText").html(jsondata); }, error:function(XMLHttpRequest, textStatus, errorThrown){ console.log('网络或服务异常'); $("#contentText").html('提交支付成功请求异常'); } }); } //提交解锁请求 function submitUnLockTest(){ var postData= getPare('#unLock',['couponCode']);; $.ajax({ type : "POST", url: baseUrl+"unLock", dataType: "json", data: postData, //mimeType : "application/json", headers: {'Content-Type': 'application/json'}, success: function(msg){ console.log(msg); var jsondata= JSON.stringify(postData); $("#contentText").html(jsondata); }, error:function(XMLHttpRequest, textStatus, errorThrown){ console.log('网络或服务异常'); $("#contentText").html('提交解锁请求异常'); } }); } var dingdan = $(".lock").html(), product = $(".productActivityRequest"); zhifu = $(".user").html(), quxiao=$(".unLock").html(); function addProduct(){ product = $(".productActivityRequest").html(); var coupon_item = document.createElement('div'); coupon_item.className= 'productActivityRequest'; coupon_item.innerHTML = product; $("#contentLock").append(coupon_item); $(".productActivityRequest").trigger("create"); } function getPare( xuanze, clazz){ var $root = $( xuanze); var object ; var array = $root.attr("name"); if( typeof(array) == "undefined"){ object = getArray($($root), clazz ); }else{ object = []; var length = $root.size(); for(var i = 0 ; i< length ; i++){ object[i] = getArray( $( $($root[i]) ) , clazz ); } } var json = JSON.stringify( object ); console.log( json ); return json; } function getArray( root , clazz ){ var object = {}; for(var ob in clazz){ var keyName = clazz[ob]; var clazzElenen = root.find( "."+keyName ); var array = clazzElenen.attr("name"); if( typeof(array) == "undefined"){ object[ keyName ] = getInt( clazzElenen ); }else { var values = []; object[keyName] = values; var length = clazzElenen.size(); for(var i = 0 ; i< length ; i++){ values[i] = getInt( $( clazzElenen[i] ) ); } } } return object; } function getInt( root ){ var child = root.find(":text"); var object = {}; var length = child.size(); for(var i = 0 ; i< length ; i++){ var input = $( child[ i ] ); var key = input.attr("name"); var value = input.val(); object[ key ] = value; } return object; } // var htmlToAdd =""; // // function addProduct(){ // htmlToAdd = $(".product").html(); // $("#lock").html($("#lock").html()+htmlToAdd); // } </script> <title></title> </head> <body> <!--<button>订单提交(上锁)</button>--> <!--<button>支付成功</button>--> <!--<button>支付成功</button>--> <form action="" method="get"> 选择您要测试的功能?<br /><br /> <label><input name="Fruit" type="radio" value="订单提交" checked onchange="chageRadio(1)"/>订单提交</label> <label><input name="Fruit" type="radio" value="支付成功" onchange="chageRadio(2)"/>支付成功 </label> <label><input name="Fruit" type="radio" value="取消订单" onchange="chageRadio(3)"/>取消订单 </label> </form> <div id="lock"> 订单提交 <div id="contentLock" name="array"> <ul class="couponCode"> <li class="desr">请输入优惠券信息 [couponCode]</li> <li> <span class="name"> 优惠券id : </span> <input name="couponId" type="text" placeholder=""> </li> <li> <span class="name"> 平台id : </span> <input name="appId" type="text" placeholder=""> </li> <li> <span class="name"> 订单id : </span> <input name="costOrderNo" type="text" placeholder=""> </li> <li> <span class="name"> 订单描述 : </span> <input name="orderDescription" type="text" placeholder=""> </li> <li> <span class="name"> 消费时间 : </span> <input name="costTime" type="text" placeholder=""> </li> <li> <span class="name"> 订单金额 : </span> <input name="amount" type="text" placeholder=""> </li> <li> <span class="name"> 使用金额 : </span> <input name="costAmount" type="text" placeholder=""> </li> </ul> <ul class="productActivityRequest" name="array"> <li class="desr" > 请输入产品信息 [productActivityRequest] </li> <li> <span class="name"> 平台id : </span> <input name="appId" type="text" placeholder=""> </li> <li> <span class="name"> 商铺id : </span> <input name="shopsId" type="text" placeholder=""> </li> <li> <span class="name"> 商铺名 : </span> <input name="shopsName" type="text" placeholder=""> </li> <li> <span class="name"> 商品id : </span> <input name="productId" type="text" placeholder=""> </li> <li> <span class="name"> 商品名 : </span> <input name="productName" type="text" placeholder=""> </li> <li> <span class="name"> 金额 : </span> <input name="price" type="text" placeholder=""> </li> <li> <span class="name"> 购买数据量 : </span> <input name="num" type="text" placeholder=""> </li> </ul> </div> <input type="button" value="增加一个产品" onclick="addProduct()"><br/> <input type="button" value="提交测试" onclick="submitLockTest()"> </div> <div id="user" > 支付成功 <ul class="couponCode" name="array"> <li class="desr" >请输入优惠券id数组 [couponCode ]</li> <li> <span class="name"> 优惠券id : </span> <input name="id" type="text" placeholder=""> </li> </ul> <input type="button" value="提交测试" onclick="submitUserTest()"> </div> <div id="unLock"> 取消订单 <ul class="couponCode" name="array"> <li class="desr" >请输入优惠券id数组 [couponCode]</li> <li> <span class="name"> 优惠券id : </span> <input name="id" type="text" placeholder=""> </li> </ul> <input type="button" value="提交测试" onclick="submitUnLockTest()"> </div> <p id="contentText"> hhhhhhhhhh</p> </body> </html>
相关推荐
1.3 在Web页面中使用JavaScript 5 1.3.1 HTML的基本结构 5 1.3.2 在HTML中嵌入JavaScript 7 1.3.3 链接JavaScript文件 9 1.4 编写JavaScript的工具 11 1.4.1 使用纯文本编辑器 11 1.4.2 使用专业化脚本编辑工具 13 ...
本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、...
《JavaScript基础教程(第8版)》循序渐进地讲述了JavaScript及相关的CSS、DOM、Ajax、jQuery等技术。书中从JavaScript语言基础开始,分别讨论了图像、框架、浏览器窗口、表单、正则表达式、用户事件和cookie,并在上...
1.3 在web页面中使用JavaScript 1.3.1 HTML的基本结构 1.3.2 在HTML中嵌入JavaScript 1.3.3 链接JavaScript文件 1.4 编写JavaScript的工具 1.4.1 使用纯文本编辑器 1.4.2 使用专业化脚本编辑工具 ...
1.4 JavaScript及其在Web页面中的位置 3 1.5 Ajax是什么 5 1.6 JavaScript是什么样子的 6 1.7 JavaScript及其在Web开发中承担的角色 7 1.8 JavaScript和事件 9 1.9 标准化JavaScript和W3C 11 1.9.1 ...
实例301 将Web页面中的数据导出到Excel并自动打印 476 11.4 利用CSS样式打印 478 实例302 利用CSS样式打印页面中的指定内容 478 实例303 利用CSS样式分页打印 479 11.5 套打邮寄产品单 482 实例304 打印汇款单 482 ...
本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、...
FGO脚本 javascript书签和其他内容的集合,用于在给定页面上快速查找FGO信息...” 您可以在gamepress 导航到他们的页面,然后单击小书签来运行脚本。 然后为每种技能选择级别,它将为您提取数据,因此您无需滚动并单击
项目概述:本项目是基于Python的Flask框架开发的一款豆瓣电影数据爬取与可视化工具。该工具不仅展现了高效的爬虫技术,还通过数据可视化手段,让用户能直观了解电影信息。技术构成包括主要的Python脚本,搭配...
尖科超级脚本虚拟机是一个功能强大、基于微软Windows系统操作系统的脚本虚拟机 主要功能有:支持多种脚本语言,并且可以同一脚本文件中使用不同的语言,并且通过共享内存方式共享不同语言的脚本的数据。...
logger2js是用原生态javascript语言编写的web页面js日志&调试工具箱 主要用于客户端脚本的分析和查错 工具提供了$alert函数来代替js固有的alert函数 除了能够指定字体颜色在控制台连续输出字符串信息以外 还...
dna-data-compessor是一个很小的库,它可以将DNA序列数据(javascript中的字符串数据类型)快速转换(和压缩)为二进制数据,反之亦然。 它可以提供最大程度的DNA数据压缩(我们假设核苷酸的分配是随机的)。 这...
1.2 如何把JavaScript添加到页面 3 外部JavaScript文件 5 1.3 第一个JavaScript程序 7 1.4 把文本写到Web页面上 9 1.5 附件外部JavaScript文件 10 1.6 追踪错误 12 1.6.1 Firefox JavaScript控制台 13 1.6.2 显示...
该工具使用 acorn 将 JavaScript AST 转换为与 Morpheus Script 兼容的数据结构。 这将允许预先解析 JavaScript 文件,以便 Morpheus 脚本引擎不需要。 用法 JavaScript var MSAN = require ( 'acorn-msan' ) ; ...
第15章 数据存储的脚本化 15.1 什么是cookie 15.1.1 浏览器和客户端cookie 15.1.2 cookie的属性 15.2 cookie的客户端存取 15.2.1 cookie的存储 15.2.2 cookie的读取 15.3 cookie的限制...
UR CSUG 和 CS 网络的网络状态页面脚本这是网络状态页面 (NetSP) 背后的魔法,由 Nate Book 策划并由 Hassler Thurston 稍作修改,目前住。 主脚本infobox.pl运行在网络上的每台计算机上。 此脚本将当前状态存储在一...
一旦掌握了这种语言的结构和术语,你将学习如何使用高级的JavaScript工具来快速为站点添加有用的交互,而不是一切从头开始编写脚本。和其他的Missing Manuals图书不同,本书清楚、精炼,手把手地讲解。 现代Web...
它还有一些小工具:) 捐 保护发展和自由事物-因为它们的生存掌握在我们手中。 您可以点击“ ”进行。 文献资料 安装 确保在浏览器中启用了用户脚本管理器: (关闭源) (OPEN SOURCE) 油脂猴!!不再使用此用户...
功能:window对象的子对象document是javascript的核心对象,在脚本中遇到 BODY元素时创建一个实例。 15. history属性 语法格式: window.history[数值] window.history.方法() window.history.属性 window...
项目概述:本项目是一个基于Python语言的职位画像系统,集成了Scrapy与Django框架,实现了数据抓取与Echarts可视化展示。该系统主要由Python、HTML、JavaScript、CSS和Shell等多种语言编写,包含532个文件,其中HTML...