目前只代码。以后补全
主要是 给开发与测试一个数据输入的页面。简单,容易编写。
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>