jquery 换一批 数据是用freemarker查询的 一共查询出来九条数据

来源:互联网 发布:p2p网络金融投资理财 编辑:程序博客网 时间:2024/05/23 17:42

1.首先是xhtml页面怎么写的  我页面用的是freemarker 

<#if listRoute??>          <#list listRoute as item>          <li id="recommend_${item_index+1}">          <dl>            <dd>               <a href="${base}/tours/${item.id?c}.html" target="_blank">                 <#if item.pictures??>                     <img id="recommend_img_${item_index+1}" src="${g_url!}uploadPics/trip/${item.pictures!}" width="318" height="200"/>                 <#else>                    <img id="recommend_img_${item_index+1}" src="images/trip/nopic.jpg" width="318" height="200"/>                 </#if>               </a>            </dd>          </dl>        </li>          </#list>       </#if>
 <a class="refresh" onclick="exchangeNumber()">换一批</a>

2.js页面

//因为我是一次性把换一批的数据全部查询出来,所以需要把li为123的数据显示 然后li为456789的隐藏
$(function(){var lengthYC=$("li:[id^='recommend_']").length;for(var i=1;i<=lengthYC;i++){if(i<=3){$("#recommend_"+i).attr("style","display:block");}else{$("#recommend_"+i).attr("style","display:none");}$("#recommend_img_"+i).attr("src",$("#recommend_img_"+i).attr("original"));}})


这是第一次写的。因为不太会,这样子也可以实现效果。但是这个代码太死,维护性不高

if($("#recommend_1").css("display")=="block"){$("#recommend_1").hide();$("#recommend_2").hide();$("#recommend_3").hide();$("#recommend_4").show();$("#recommend_5").show();$("#recommend_6").show();$("#recommend_7").hide();$("#recommend_8").hide();$("#recommend_9").hide();}else if($("#recommend_4").css("display")=="block"){$("#recommend_1").hide();$("#recommend_2").hide();$("#recommend_3").hide();$("#recommend_4").hide();$("#recommend_5").hide();$("#recommend_6").hide();$("#recommend_7").show();$("#recommend_8").show();$("#recommend_9").show();}else if($("#recommend_7").css("display")=="block"){$("#recommend_1").show();$("#recommend_2").show();$("#recommend_3").show();$("#recommend_4").hide();$("#recommend_5").hide();$("#recommend_6").hide();$("#recommend_7").hide();$("#recommend_8").hide();$("#recommend_9").hide();}


所以需要在进行修改,那要怎么改呢?

//换一批事件function exchangeNumber(){//把换一批的li的数据长度找到 var yincang=$("li:[id^='recommend_']").length;//这里是定义当前显示的ID值最大var j;for(var i=1;i<=yincang;i++){if(!($("li:[id='recommend_"+i+"']").is(":hidden"))){j=i;}}//这个循环完成的是隐藏显示for(var i=1;i<=yincang;i++){//如果为9,换成0if(j==9){j=0;}if(i==j+1||i==j+2||i==j+3){$("#recommend_"+i+"").show();}else{$("#recommend_"+i+"").hide();}}}


欧耶。完成。

之前想了好久都没有想到要怎么做。终于好了。

0 0
原创粉丝点击