javascript - 一個頁面有四個圖片,翻頁的時候想固定住某個圖片然后翻頁,如何實現(xiàn)呢?
問題描述
頁面是這樣:一頁上顯示四張圖片,每次翻頁的時候四張一起更換,現(xiàn)在想在每個圖片的左上角添加一個勾選框,當(dāng)圖片對應(yīng)的勾選框被選中時,點擊下一頁或者上一頁,這張圖片不會更換,而未勾選的圖片會更換。我現(xiàn)在能想到的就是記錄一下被選中時圖片在數(shù)據(jù)庫中的rownum,然后根據(jù)這rownum以及當(dāng)前是否有固定住的圖片來設(shè)置pageSize例如:左上角圖片被勾選的時候,pageSize=3;沒有勾選的時候pageSize = 4
現(xiàn)在的問題是,前臺怎么處理呢?我用asp.net開發(fā)的程序,前臺展示用的asp.net的控件自動迭代出來的結(jié)果,怎么控制呢?
<asp:DataList runat='server' RepeatColumns='2'><ItemTemplate> <p class='col-lg-12'><p style='margin-top: 5px'>科目代碼:</p><p style='margin-top:5px;margin-left:-10px'><%#Eval('TJ_KM_DM')%></p><p style='margin-top: 5px; text-align:right'>考試時間:</p><p style='margin-top: 5px;'><%#Eval('KSSJ') %></p><input type='hidden' value='<%#Eval('KS_ZKZ')%>' /><input type='hidden' value='<%#Eval('BJSH_JG_QX')%>'/> <input type='hidden' value='img/<%#Eval('KSSJ').ToString()+'/'+Eval('TJ_KM_DM').ToString().Trim()+'/'+Eval('KS_ZKZ')+'.jpg'%>' /><p style='margin-left:50px'> <input value='未標(biāo)記' type='button' onclick='signCard(this)' /></p><img src='http://m.4tl426be.cn/img/<%#Eval('KSSJ').ToString()+'/'+Eval('TJ_KM_DM').ToString().Trim()+'/'+Eval('KS_ZKZ')+'.jpg'%>' alt='Responsive image' /> </p></ItemTemplate> </asp:DataList>
上面的代碼,直接可以迭代出上圖的效果,如果按照上面說的內(nèi)容,我感覺需要操作每個img沒什么好的辦法,求大神指導(dǎo)。
問題解答
回答1:我提供我個人的想法:你需要一個數(shù)據(jù)棧來保存相關(guān)的信息,標(biāo)記一個保存一個,然后再每次翻頁的時候都進(jìn)行一次數(shù)據(jù)讀取,如果能讀到數(shù)據(jù),則返回數(shù)據(jù)并進(jìn)行相關(guān)操作,然后繼續(xù)讀取,直到讀完再使用新的數(shù)據(jù)。
