【avalon2】avalon2在IE8下，数据渲染不成功。
本文介绍了【avalon2】avalon2在IE8下，数据渲染不成功。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
版本 avalon version 2.2.2
环境 IE8
这页面是通过FTL渲染的，在其他的浏览器都没有问题
<div class="container" ms-controller="search-terms">
<div class="page-action">
<table class="tablelayout-auto">
<td class="wp40">
<span>
<span class="page-action-title" data-toggle="dropdown">{{@title}}<span class="caret"></span><i class="cnfont cnfont-location"></i></span>
<ul class="dropdown-menu" role="menu">
<li><a role="menuitem" ms-on-click="cloumClick('szse','szse','深市')">深市</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('szse','szse_main','深主板')">深主板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('szse','szse_sme','中小板')">中小板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('szse','szse_gme','创业板')">创业板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('sse','sse','沪主板')">沪主板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('neeq','neeq_company','新三板')">新三板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('staq','staq_net_delisted','老三板')">老三板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('hke','hke_main','港主板')">港主板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('hke','hke_gem','港创业板')">港创业板</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('fund','fund','基金')">基金</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('bond','fund','债券')">债券</a></li>
<li><a role="menuitem" ms-on-click="cloumClick('regulator','regulator','监管')">监管</a></li>
</ul>
</span>
<span class="page-action-tab">
<a href="notice.html">公告</a>
<a href="notice-zhaiyao.html">摘要</a>
<a href="notice-diaoyan.html">调研</a>
</span>
</td>
<td class="wp20">
<div class="page-action-info">
<span>共200家</span>
<span>300条</span>
</div>
</td>
<td class="wp40 index-search">
<div class="page-action-search">
<!--<input type="text" name="search">-->
<input name="search" id="index-cw-input-obj" class="input-class" type="text"autocomplete="off" maxlength="6" placeholder="代码/简称/拼音" />
<ul id="index-cw-stock-list" name="cw-stock" class="drop-down-list index-search-list" style="display:none;">
<li class="title">
<dd>代码</dd>
<dd>类别</dd>
<dd>简称</dd>
</li>
</ul>
<button title="搜索" onclick="search();"><i class="cnfont cnfont-search"></i></button>
<a class="sub-more page-more-filter" href="#">高阶搜</a>
</div>
</td>
</table>
</div>
<div class="page-filter" style="display: block;">
<div class="sub-child page-filter-select" ms-if="module!='hke'">
<span class="sub-title">分类</span>
<div class="sub-filter">
<a ms-for="el in @category | filterBy(@fn)" ms-attr="{'data-key':'category-'+ el}">{{el}}</a>
</div>
<div class="sub-filter">
<a ms-for="el in @category | filterBy(@fn2)" ms-attr="{'data-key':'category-'+ el}">{{el}}</a>
</div>
<div class="sub-filter">
<a ms-for="el in @category | filterBy(@fn3)" ms-attr="{'data-key':'category-'+ el}">{{el}}</a>
</div>
<div class="sub-filter">
<a ms-for="el in @category | filterBy(@fn4)" ms-attr="{'data-key':'category-'+ el}">{{el}}</a>
</div>
<#--<a ms-for="(@k,@v) in @category" class={{@k}}>{{@v}}</a>-->
<#--<a data-key="trade-all" class="page-filter-default">全部</a>-->
<#--<a data-key="trade-nonglin" class="active">农、林、牧、渔业</a>-->
<#--<a data-key="trade-caikuang">采矿业</a>-->
<#--<a data-key="trade-zhizhao">制造业</a>-->
<#--<a data-key="trade-dianre">电力、热力、水产和供应业</a>-->
<#--<a class="sub-hidden" data-key="trade-jianzhu">建筑业</a>-->
<#--<a class="sub-hidden" data-key="trade-pifa">批发和零售业</a>-->
<#--<a class="sub-hidden" data-key="trade-yunshu">交通运输、仓储和邮政业</a>-->
<#--<a class="sub-hidden" data-key="trade-jianzhu">建筑业</a>-->
<#--<a class="sub-hidden" data-key="trade-pifa">批发和零售业</a>-->
<#--<a class="sub-hidden" data-key="trade-yunshu">交通运输、仓储和邮政业</a>-->
</div>
<div class="sub-child page-filter-select" ms-if="module=='fund'">
<span class="sub-title">基金</span>
<a data-key="fund-all" class="page-filter-default">全部</a>
<a data-key="fund">天鸿基金</a>
<a data-key="fund">华夏基金</a>
<a data-key="fund">天鸿基金</a>
<a data-key="fund">华夏基金</a>
<span class="sub-dialog-group">
<span class="sub-dialog">更多基金...</span>
<div class="sub-dialog-order sub-hidden">
<ul class="tab-list tab-mini">
<li class="active"><a data-action="#filter-order-1" data-toggle="tab">ABCDE</a></li>
<li><a data-action="#filter-order-2" data-toggle="tab">FGHJ</a></li>
<li><a data-action="#filter-order-3" data-toggle="tab">KLMNOP</a></li>
<li><a data-action="#filter-order-4" data-toggle="tab">PQRSTW</a></li>
<li><a data-action="#filter-order-5" data-toggle="tab">XYZ</a></li>
</ul>
<div class="tab-content">
<div id="filter-order-1">
</div>
<div id="filter-order-2" class="display-hidden">
</div>
<div id="filter-order-3" class="display-hidden">
</div>
<div id="filter-order-4" class="display-hidden">
</div>
<div id="filter-order-5" class="display-hidden">
</div>
</div>
</div>
</span>
</div>
<div class="sub-child page-filter-select">
<span class="sub-title">日期</span>
<a data-key="date-tomorrow">明日</a>
<a data-key="date-today">今日</a>
<a data-key="date-twoday">近两日</a>
<a data-key="date-week">近一周</a>
<a data-key="date-month" class="active">近一月</a>
<a data-key="date-threemonth">近三月</a>
<a data-key="date-threeyear">近三年</a>
<span class="sub-calendar">
<input class="datepicker-input" name="data-custom" type="datetime" placeholder="自选">
<i class="fg fg-calendar"></i>
</span>
<span ms-if="@more" class="page-filter-more">展开其他搜索项({{@more}})</span>
</div>
<div class="sub-child sub-child-hidden page-filter-select">
<span class="sub-title">行业</span>
<a ms-for="el in @trade" ms-attr="{'data-key':'trade-'+ el}">{{el}}</a>
</div>
<div class="sub-child">
<span class="sub-title">关键字</span>
<span class="sub-search index-search">
<input name="search" id="index-cw-input-obj-more" class="input-class" type="text"autocomplete="off" maxlength="6" placeholder="代码/简称/拼音" />
<ul id="index-cw-stock-list-more" name="cw-stock" class="drop-down-list index-search-list" style="display:none;">
<li class="title">
<dd>代码</dd>
<dd>类别</dd>
<dd>简称</dd>
</li>
</ul>
</span>
<span class="sub-check page-filter-checked"></span>
<span class="sub-clean page-filter-clean">全部删除</span>
</div>
</div>
<div class="page-list">
<table class="page-list-list">
<tr>
<th class="sub-code">代码</th>
<th class="sub-name">简称</th>
<th class="sub-title">公告标题</th>
<th class="sub-time last-child">公告时间</th>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
<tr>
<td class="sub-code">000055</td>
<td class="sub-name">一心堂</td>
<td class="sub-title">
<a>2016年9月9日投资者关系活动记录表<i class="cnfont cnfont-file-word"></i>(59KB)</a>
</td>
<td class="sub-time last-child">
<div class="sub-time-share">
<a href="#"><i class="cnfont cnfont-eye"></i>浏览</a>
<a href="#"><i class="cnfont cnfont-share"></i>转载</a>
<a href="#" class="active"><i class="cnfont cnfont-star"></i>收藏</a>
</div>
<div class="sub-time-time">2016-10-20</div>
</td>
</tr>
</table>
</div>
<div class="page-tabs">
<div class="page-tabs-list">
<a href="#1" class="sub-first"><<</a>
<a href="#1" class="sub-prev"><</a>
<a href="#1">1</a>
<a href="#1" class="active">2</a>
<a href="#1">3</a>
<a href="#1" class="sub-more">...</a>
<a href="#1">9</a>
<a href="#1">10</a>
<a href="#1">11</a>
<a href="#1" class="sub-next">></a>
<a href="#1" class="sub-end">>></a>
</div>
<div class="page-tab-jump">
<form enctype="multipart/form-data" method="get" action="">
<span>跳转到:</span>
<input name="page" />
<button type="submit">跳转</button>
</form>
</div>
<div class="page-tab-count">
<span>共200家</span>
<span>300条</span>
</div>
</div>
</div>
var module = "szse",
cloum = "",
title = "深市";
var vm = avalon.define({
$id: "search-terms",
category: {},
trade: {},
plate: '',
column: '',
more: '',
title: title,
module:'',
cloumClick: function (a, e, t) {
vm.column = e;
vm.module = a;
vm.title = t;
},
fn: function (el, i) {
return i < 4
},
fn2: function (el,i) {
return i > 4 && i < 9
},
fn3: function (el, i) {
return i > 8 && i < 16
},
fn4: function (el,i) {
return i > 15
},
fn5: function (el,i) {
return i < 11
},
fn5: function (el,i) {
return i > 10
}
});
在Chrome下
在IE8 下 {{}}不渲染
控制台没有报错信息
F12调试发现vm里已经有值，而且跳到了VBScript 的eval code代码，但是页面就是渲染不出来数据。
（IE8 安全设置也检查过）
解决方案
应该是vm里重复定义fn5在ie8下会出问题，自己也遇到过
fn5: function (el,i) {
return i < 11},
fn5: function (el,i) {
return i > 10}
这篇关于【avalon2】avalon2在IE8下，数据渲染不成功。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
