日期:2014-05-17  浏览次数:20781 次

ie和火狐兼容性问题(锚标记)
测试代码的时候,IE锚标记有用,在火狐和谷歌就失效了!求大神指点!
action代码:
private String[] brandArray={"A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"};


@RequestMapping("/brand_index_cn")
public String brandIndexCn(HttpServletRequest request,HttpServletResponse response, Model model){

List<Brand> brandList=brandService.findAll();
Map<String, List<Brand>> brandMapByPinYin=brandService.rankByBrandName(brandList);

model.addAttribute("brandList", brandList);
model.addAttribute("brandMapByPinYin", brandMapByPinYin);
model.addAttribute("brandArray", brandArray);

return "brand/brand_index_cn";
}
这个是页面代码:
<div class="brand_word" ><a href="#a">A</a><a href="#b">B</a><a href="#c">C</a><a href="#d">D</a><a href="#e">E</a><a href="#f">F</a><a href="#g">G</a><a href="#h">H</a><a href="#i">I</a><a href="#j">J</a><a href="#k">K </a><a href="#l">L</a><a href="#m">M</a><a href="#n">N</a><a href="#o">O</a><a href="#p">P</a><a href="#q">Q</a><a href="#r">R</a><a href="#s">S</a><a href="#t">T</a><a href="#u">U</a><a href="#v">V</a><a href="#w">W</a><a href="#x">X</a><a href="#y">Y</a><a href="#z">Z</a></div>
  <div class="clear_both"></div>
  </div>
  <div class="brand_store">
  <div class="brand_store_name"> 
   
  <c:forEach items="${brandArray}" var="brandArr">
  <div><a name="${brandArr}"></a></div>
<div class="brand_store_name">
<h2><c:out value="${brandArr}" /></h2>
<span>
<c:forEach items="${brandMapByPinYin}" var="entry">
<c:if test="${entry.key==brandArr}">
<table width="100%">
<tr>
<c:forEach items="${entry.value}" var="brand" varStatus="ROW" >
<td width="20%">
<a><c:out value="${brand.cnBrandName}"/> </a>
</td>
<c:if test="${ROW.count mod 5==0}">
<tr/>
</c:if>
</c:forEach>

</tr>
</table>
</c:if>
</c:forEach>
</span>
</div>
  </c:forEach>

------解决方案--------------------
定义锚点的时候,尽量规范点(这样兼容性会比较好):
<a id="A" name="A"></a>