初始将数据
data_
渲染到页面上没有问题,第二次将数据data_
渲染到页面上没有生效,经过调试发现doT.template($("#inCome-service").html())
这行代码出了问题var list = $("#get_skill_boss_id"); var tempFn = doT.template($("#get_skill_boss_tpl").html()); var resultHTML = tempFn(data_); list.html(resultHTML);
错误写法:模板嵌套在了容器中
,即:get_skill_boss_tpl
嵌套在了get_skill_boss_id
中
<div class="containter" id="get_skill_boss_id">
<script type="text/x-dot-template" id="get_skill_boss_tpl">
<div class="topBanner">
<div class="topItem" title='{"user_login":"{{=it.user_login}}"}' onclick="call_user_login(this)">
<span class="circle">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-dianhua-jineng"></use>
</svg>
</span>
<span>电话联系</span>
</div>
{{? it.type == 1 }}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click">
<span class="circle" >
<span class="iconfont iconPosition icon-weikuan-jineng " style="font-size:30px;color:#999999;"></span>
</span>
<span id="pay_last_money_text" style="color:#999999;">支付尾款</span>
</div>
{{?? it.type == 2}}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click" >
<span class="circle" >
<span class="iconfont iconPosition icon-weikuan-jineng " style="font-size:30px;color:#999999;"></span>
</span>
<span id="pay_last_money_text" style="color:#999999;">尾款已付</span>
</div>
{{?? it.type == 3}}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click" onclick="pay_last_money_func(this)">
<span class="circle">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-weikuan-jineng"></use>
</svg>
</span>
<span id="pay_last_money_text">支付尾款</span>
</div>
{{?}}
</div>
<div class="topBox">
<div class="topDeail">
<div><span>预约时长:</span>{{=it.num}} 小时</div>
<div><span>已付意向金:</span>{{=it.advance_fee}} 元</div>
<div>
<span>服务总额:</span>¥{{=it.total}} 元
<div style="display:inline-block;height: 100%;padding-top: 2px;margin-right:5px;"><span onclick="onDetail()" tapmode class="iconfont icon-wenhao"></span>
</div>
</div>
<div><span>预约地点:</span>{{=it.address}}</div>
</div>
<div class="bottomBox">
<div class="bottomLeftBox">
<img src="{{=ImgUrl+it.avatar}}" style="width:60px;height:60px;border-radius:50%;">
<span style="font-size:16px;color:#333333;">{{=it.user_nickname}}</span>
<div style="font-size:13px;color:#808080;">
<span>{{=it.sex==1?'男':'女'}}</span>
<div style="display:inline-block;width:1px;height:10px;background-color:gray;"></div>
<span>{{=it.birthday}}岁</span>
</div>
</div>
<div class="bottomRightBox">
<span style="font-size:16px;color:#333333;font-weight:bold;">{{=it.title}}</span>
<span style="font-size:13px;color:#808080;">{{=it.content}}</span>
{{? it.n_time}}
<div>
<span id="recordControl" class="voiceTime iconfont icon-yuyin" tapmode onclick="event.stopPropagation();playOrPause(this)" voiceUrl="{{=ImgUrl+it.url }}">
{{=it.n_time}}"</span>
<span class="twinkleSpan iconfont icon-yuyin"></span>
</div>
{{?}}
</div>
</div>
<div class="connectBtn" title='{"other_nickname":"{{=it.user_nickname}}","other_userid":"{{=it.to_user_id}}","other_head_url":"{{=ImgUrl+it.avatar}}"}' onclick="chatOnclick(this)">与需求者沟通</div>
</div>
</script>
</div>
正确写法:模板和容器独立开来
,即:get_skill_boss_tpl
和get_skill_boss_id
互相独立
<div class="containter" id="get_skill_boss_id">
</div>
<script type="text/x-dot-template" id="get_skill_boss_tpl">
<div class="topBanner">
<div class="topItem" title='{"user_login":"{{=it.user_login}}"}' onclick="call_user_login(this)">
<span class="circle">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-dianhua-jineng"></use>
</svg>
</span>
<span>电话联系</span>
</div>
{{? it.type == 1 }}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click">
<span class="circle" >
<span class="iconfont iconPosition icon-weikuan-jineng " style="font-size:30px;color:#999999;"></span>
</span>
<span id="pay_last_money_text" style="color:#999999;">支付尾款</span>
</div>
{{?? it.type == 2}}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click" >
<span class="circle" >
<span class="iconfont iconPosition icon-weikuan-jineng " style="font-size:30px;color:#999999;"></span>
</span>
<span id="pay_last_money_text" style="color:#999999;">尾款已付</span>
</div>
{{?? it.type == 3}}
<div class="topItem" title='{"id":"{{=it.id}}"}' id="pay_last_money_click" onclick="pay_last_money_func(this)">
<span class="circle">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-weikuan-jineng"></use>
</svg>
</span>
<span id="pay_last_money_text">支付尾款</span>
</div>
{{?}}
</div>
<div class="topBox">
<div class="topDeail">
<div><span>预约时长:</span>{{=it.num}} 小时</div>
<div><span>已付意向金:</span>{{=it.advance_fee}} 元</div>
<div>
<span>服务总额:</span>¥{{=it.total}} 元
<div style="display:inline-block;height: 100%;padding-top: 2px;margin-right:5px;"><span onclick="onDetail()" tapmode class="iconfont icon-wenhao"></span>
</div>
</div>
<div><span>预约地点:</span>{{=it.address}}</div>
</div>
<div class="bottomBox">
<div class="bottomLeftBox">
<img src="{{=ImgUrl+it.avatar}}" style="width:60px;height:60px;border-radius:50%;">
<span style="font-size:16px;color:#333333;">{{=it.user_nickname}}</span>
<div style="font-size:13px;color:#808080;">
<span>{{=it.sex==1?'男':'女'}}</span>
<div style="display:inline-block;width:1px;height:10px;background-color:gray;"></div>
<span>{{=it.birthday}}岁</span>
</div>
</div>
<div class="bottomRightBox">
<span style="font-size:16px;color:#333333;font-weight:bold;">{{=it.title}}</span>
<span style="font-size:13px;color:#808080;">{{=it.content}}</span>
{{? it.n_time}}
<div>
<span id="recordControl" class="voiceTime iconfont icon-yuyin" tapmode onclick="event.stopPropagation();playOrPause(this)" voiceUrl="{{=ImgUrl+it.url }}">
{{=it.n_time}}"</span>
<span class="twinkleSpan iconfont icon-yuyin"></span>
</div>
{{?}}
</div>
</div>
<div class="connectBtn" title='{"other_nickname":"{{=it.user_nickname}}","other_userid":"{{=it.to_user_id}}","other_head_url":"{{=ImgUrl+it.avatar}}"}' onclick="chatOnclick(this)">与需求者沟通</div>
</div>
</script>
网友评论