Hbuilder mui HTML动态生成模板加载数据-问卷调查动态生成示例

本实例通过text/templete的script标签来动态生成代码-实现动态生成问卷调查。

先睹为快方法

<!--使用循环来控制创建的题目个数--> 
<% 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="item<%=(j+1)%>"> 
                    <label id="item-lab<%=(j+1)%>"><%=res.lab%></label> 
                    <input name="radio<%=(i+1)%>" id="item-rdo<%=(j+1)%>" type="radio"> 
                </div> 
                <% } %> 
        </div> 
    </div> 
 <% } %> 

有些熟悉味道，循环语句，类似jsp语法

实现方法：

第一：将相关的资源引入进来，我们可以看到我们只需要引用arttmpl.js文件就好了。

第二：将模板写好，模板中可以使用js代码,代码使用<%%>包围起来即可。

第三：需要组件JSON数据，可以通过ajax获取json数据

第四：将相关的数据绑定到模板上

  var str = template('radio-tigan', { "record": record });  $(".mui-content").html(str);