翻页后保持复选框选中的js实现方法

项目中的分页使用真正的分页。每次点击上下按钮后，再次调用后台方法，再次查询刷新此页面。因此，复选框为假。比如酷狗音乐中，上下页选择的歌曲不会被保留，只有在每一页添加后，才切换到下一页。但是项目中有要求，所以只能实现。项目具体要求如下：授权角色时，选择模块及模块下的操作，点击上下页，选中的复选框不变。界面如下：

实现思路如下：在界面上，使用纯js。选中复选框中的id，包括模块id和操作id，被拼接成一个字符串，然后该字符串被传递给操作。每次调用这个页面，首先要调用正在运行的选中的id字符串，然后根据id字符串在这个接口中再次拼接选中的id。选中该复选框，需要判断，如果它不在id容器中，则将其装入；需要判断未选中的复选框；如果它们在id容器中，则需要删除它们；页面完全加载后，界面中的复选框会与拼接的id字符串容器进行比较，如果在字符串容器中，则会自动在复选框中选中。否则，假的。注意：因为想法是把拼接的id作为一个字符串，所以在js中获取动作中选中的id字符串时要注意语法。实现代码如下：在java中获取动作的id容器；复制代码如下：字符串ids=(字符串)request . getattribute(' id ')；if((ids==null)){ ids=' '；} js代码：上一页函数：复制代码如下： function _ prepage(){ var ids=' %=ids % '；var checkedIds=新字符串(idsvar modules=document . getelementsbyname(' module ')；var operations=document . getelementsbyname(' operate ')；for(var I=0；I模块.长度；i ) { if(模块[i]。type=='checkbox '模块[i]。选中){ if(checkedIds.indexOf(模块[i])。value==-1){ Checkedids=Checkedids模块[i]。值'，'；}//判断模块下的操作为(var j=0；j操作长度；j){ var Operateid=new String(operations[j])。id)；opera Eid=opera Eid . substring(0，operateId.indexOf('，'))；if(模块[i]。value==OperatiID){ if(operating[j])。type=='checkbox '操作[j]。选中){ if(checkedIds.indexOf(操作[j])。value==-1){ Checkedids=Checkedids操作[j]。值'，'；} } if(操作[j]。checked==false){ if(Checkedids . indexof(操作[j])。值)！=-1){ Checkedids=Checkedids . replace((操作[j])。值'，')，' ')；} } } } } if(模块[i]。checked==false){ if(Checkedids . indexof(modules[I])。值)！=-1){ Checkedids=Checkedids . replace((模块[i])。值'，')，' ')；} } } with(document . forms[0]){ action=' RoleauthorizedManager！getModuleOperateBySystem？RoleID=' document . GetElementBYID(' RoleID ')。值“system id=”document . getelementbyid(“system id”)。value ' page no=' %=page model module . getpreviouspagenumber()% ' query string=' document . getelementbyid(' search byid ')。值“ids=”checkedIds；方法=' postsubmit()；}}接口完全加载后，js代码如下：复制代码如下： document . onreadystatechange=state change；function state change(){ var ids=' %=ids % '；var checkedIds=新字符串(ids如果(文档。readystate=' complete') {//Loop所有控件varinputs=document。getelementsbytagname(' input ')；for(var I=0；iinputs.lengthi ) { if(输入[i]。type==' checkbox '){ if(checkedids . indexof(输入[i])。值)！=-1) {输入[i]。选中=真；}}}}}说明：测试时总是提示功能未定义，不仅提示下一页功能未定义，还提示界面上所有按钮未定义。所以我挣扎了很久。解决后分享。在这种情况下，页面上一定有错误。jsp解析成html后，html页面中一定存在一些语法问题，使得html页面无法解析。在js的开头，有些代码：varids=%=ids %查看源文件时，发现js中下一页的某句话解析如下：varids=；这种语法问题解决不了，所以不能一直运行。其原因是：var ids=%=ids %从action传递的id容器是一个空字符串，所以解析后变成var ids=了；因为id容器被视为一个字符串，所以它需要var ids=' %=ids % '。即使传递了空字符串，解析结果也如下：var ids=总结：当整个页面的js函数无法执行时，肯定说明js有问题，某个js函数中的语法问题导致整个页面无法解析运行。如果没有定义js函数，函数名可能与标签定义的函数不同。

如果js函数的语句中的一个字符是未定义的，那么未定义的字符将被明确提示。