本文主要包含hbuilder mui,hbuilder mui视频教程,hbuilder mui教程,hbuilder mui api,hbuilder mui app等相关知识,教程希望在学习及工作中可以帮助到您
");
</div>
那么今天我就和大家说说另一种更加牛掰的方式,那就是通过text/templete的script标签来动态生成代码。
需求还是和(1)一样,就是实现动态生成问卷调查,那么我们先看一下代码是怎样的?
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <title>模板页的使用</title>
- <script src="../js/jquery-2.0.3.min.js"></script>
- <script src="../js/mui.min.js"></script>
- <link href="../css/mui.min.css" rel="stylesheet" />
- <script type="text/javascript" charset="UTF-8">
- mui.init();
- </script>
- </head>
- <body>
- <header class="mui-bar mui-bar-nav">
- <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
- <h1 class="mui-title">单选试题</h1>
- </header>
- <div class="mui-content">
- <!--此处是用来动态追加对应的提干内容-->
- </div>
- <div style="text-align: center;margin-top:10px;">
- <button class="mui-btn mui-btn-blue" id="generate" style="width:80%">通过模板生成题目</button>
- </div>
- </body>
- </html>
- <script src="../js/jquery-2.0.3.min.js"></script>
- <script src="../js/arttmpl.js"></script>
- <!--题干模板-->
- <script type="text/templete" id="radio-tigan">
- <!--使用循环来控制创建的题目个数-->
- <% for(var i in record){ var item=record[i]; %>
- <div class="question">
- <h5 class="mui-content-padded" id="tigan<%=(i+1)%>"><%=item.title%></h5>
- <div class="mui-input-group" id="option<%=(i+1)%>">
- <!--此处使用循环来控制每道题目究竟生成多少选项-->
- <% for(var j in item.content){ var res=item.content[j]; %>
- <div class="mui-input-row mui-radio mui-left" id=&quo