Commit b09ef7fe authored by liujiangnan's avatar liujiangnan

feat: 调试页面

parent 885cdb10
...@@ -10,7 +10,7 @@ var uploadData = window.courseware.uploadData(); //上传文件必须要的参 ...@@ -10,7 +10,7 @@ var uploadData = window.courseware.uploadData(); //上传文件必须要的参
*/ */
//对应模板的名称,这个可以不写,但是最好是能写上,同时开发多个模板的情况下如果不写这个,本地缓存可能会存在混乱 //对应模板的名称,这个可以不写,但是最好是能写上,同时开发多个模板的情况下如果不写这个,本地缓存可能会存在混乱
var key = "h5_test"; var key = "kaishi_test_01";
$(function(){ $(function(){
window.courseware.getData(function(data){ window.courseware.getData(function(data){
......
...@@ -3,6 +3,55 @@ body { ...@@ -3,6 +3,55 @@ body {
background: #fff; background: #fff;
} }
#test{ .main {
margin: 80px; position: absolute;
} top: 0px;
\ No newline at end of file right: 0px;
bottom: 0px;
left: 0px;
padding: 20px;
}
table {
margin-top: 20px;
width: 100%;
}
.log-container {
margin-top: 10px;
height: 60%;
border: dotted 2px #E4E7ED;
border-radius: 10px;
position: relative;
}
.log {
position: absolute;
top: 10px;
right: 10px;
bottom: 10px;
left: 10px;
overflow: auto;
}
.option {
background-color: #DCDFE6;
border-radius: 5px;
width: 90%;
margin-left: 5%;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
color: #303133;
cursor: pointer;
}
.clear {
position: absolute;
bottom: 5px;
right: 5px;
z-index: 10;
cursor: pointer;
color: #409EFF;
}
...@@ -10,7 +10,23 @@ ...@@ -10,7 +10,23 @@
<script type="text/javascript" src="//staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"></script> <script type="text/javascript" src="//staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"></script>
</head> </head>
<body> <body>
<h1 id="test"></h1> <div class="main">
<div>通讯调试日志:</div>
<div class="log-container">
<span class="clear">清除日志</span>
<div class="log"></div>
</div>
<table border="0" style="width: 100%;">
<tr>
<td><div class="option">选项A</div></td>
<td><div class="option">选项B</div></td>
<td><div class="option">选项C</div></td>
<td><div class="option">选项D</div></td>
</tr>
</table>
<h1 id="test"></h1>
</div>
</body> </body>
<script src="./index.js"></script> <script src="./index.js"></script>
</html> </html>
\ No newline at end of file
...@@ -9,7 +9,7 @@ window.air.hideAirClassLoading(key,data); //页面加载完成时,必须调 ...@@ -9,7 +9,7 @@ window.air.hideAirClassLoading(key,data); //页面加载完成时,必须调
//对应模板的名称,这个可以不写,但是最好是能写上,同时开发多个模板的情况下如果不写这个,本地缓存可能会存在混乱 //对应模板的名称,这个可以不写,但是最好是能写上,同时开发多个模板的情况下如果不写这个,本地缓存可能会存在混乱
var key = "h5_test"; var key = "kaishi_test_01";
$(function(){ $(function(){
...@@ -25,19 +25,23 @@ $(function(){ ...@@ -25,19 +25,23 @@ $(function(){
//数据渲染完成后,添加各种交互或者动画效果 //数据渲染完成后,添加各种交互或者动画效果
//我这里简单做一个渐入渐出效果的例子 //我这里简单做一个渐入渐出效果的例子
var flag = true;
setInterval(function(){ setInterval(function(){
if(flag){ $("#test").fadeToggle(500);
$("#test").fadeIn(500);
}else{
$("#test").fadeOut(500);
}
flag = !flag;
},1000) },1000)
//在页面加载、事件、动画等都初始化完成后,一定要记得调用此方法,否则模板将是不可用的 //在页面加载、事件、动画等都初始化完成后,一定要记得调用此方法,否则模板将是不可用的
window.air.hideAirClassLoading(key,data); window.air.hideAirClassLoading(key,data);
},key); },key);
$(".option").bind("click", function(){
const txt = $(this).text();
$(".log").append(`页面点击触发了:${txt} <br>`);
//获取滚动条高度
var sh = $(".log").prop("scrollHeight");
$('.log').animate({scrollTop:sh},10);
});
$(".clear").bind('click', function(){
$(".log").html("");
});
}) })
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment