用css+js做了个选项卡,选项卡中触发action后防刷新

Question

javascriptcookiecss

Answer 1

【js中cookie的使用详细分析】

Answer 2

有参考价值，就是不知道如何下手……对于我的项目，传到cookie里的值是"boxNav"+n吗？……

Answer 3

加载页面的时候去取那个值，然后根据该值设定对应的元素，或者你使用局部无刷新处理方式，只刷新列表的数据，可以使用jquery的load方法也可以使用ajax

Answer 4

既然是分页,你这个分页的数据肯定是需要传到后台的，然后再根据后台反馈到前台来的，而且每次提交action肯定会重新加载页面，所以在每次加载页面的时候都应该去初始化这些数据

Answer 5

谢谢楼上两位，大致想了一下js修改为：
function $(id){return document.getElementById(id);}
function clickNav(n){
 addCookie("navBox",n,0);
 //也就是说，当点击一个选项卡时，存一个cookie对吧？
 for(i=1;i<=4;i++){
 $('boxNav'+i).className='normaltab';
 $('boxContent'+i).className='nosee';
  }
 $('boxNav'+n).className='hovertab';
 $('boxContent'+n).className='see';
}现在问题是，当在某个选项卡触发action再返回到这个页面时，应该是程序哪个位置读cookie呢？
是在jsp页面一开始吗？读到哪个cookie就返回哪个cookie？这个思路对否？…………

Answer 6

你的意思是在jsp页面加载的时候就应该读cookie吗？jquery没有用过这个，不太会……

Answer 7

你的意思是在jsp页面加载的时候就应该读cookie吗？jquery没有用过这个，不太会……
读毛的cookie，最好不要取cookie的值，这个东西是存在用户机子上面的，我的意思是你点击下一页的时候把当前页提交到后台，然后重新再加载页面的时候你再把这个页面取出来，你都说是JSP啦，我不晓得你有没有用struts之类的框架哈，反正在重新加载这个页面的时候你去取这个值就OK了

Answer 8

比如说一个分页，肯定是这样的，首先一个查询，你要查询的总数totalCount,第几页pageIndex，每页多少数据pageSize，你肯定是根据这些条件去查询分页数据的撒，那你请求的时候，同时返回这几个数据，比如说
<form name="testForm">
<s:hidden name="totalCount" value="17">
<s:hidden name="pageIndex" value="1">
<s:hidden name="pageSize" value="5">
<div>
此处为分页数据</div>
<a class="check" onclick="goPage(1)">1</a><a onclick="goPage(2)">2</a><a onclick="goPage(3)">3</a><a onclick="goPage(4)">4</a>
</form>
当然以上内容可以使用jsp自定义标签来封装你也可以采用别的方式来自动生成，但是肯定由totalCount，pageIndex，pageSize来动态生成的，至于具体怎么做就不多说了，原理很简单，你必须保证这三个都有值，即将这三个参数的值传回后台同时也将这三个参数反馈到前台隐藏住，方便下一次使用

Answer 9

我明白你的意思了。我用的ssh，但是分页功能已经实现了，也就是说你说的这几个参数已经传到jsp页面了。现在我的问题只是点击onclick="goPage(4)的时候选项卡会重新跳到第一个去……

Answer 10

我明白你的意思了。我用的ssh，但是分页功能已经实现了，也就是说你说的这几个参数已经传到jsp页面了。现在我的问题只是点击onclick="goPage(4)的时候选项卡会重新跳到第一个去……
那就是你的分页标签没写好撒，你可以获取到上次点击的那个页数撒，然后你可以根据上次点击的那个页让那个元素选中撒，由于本公司使用的是jsp自定义标签是在后台直接拼接的html标签，当然在前台一样是可以实现的

Answer 11

我明白你的意思了。我用的ssh，但是分页功能已经实现了，也就是说你说的这几个参数已经传到jsp页面了。现在我的问题只是点击onclick="goPage(4)的时候选项卡会重新跳到第一个去……
那就是你的分页标签没写好撒，你可以获取到上次点击的那个页数撒，然后你可以根据上次点击的那个页让那个元素选中撒，由于本公司使用的是jsp自定义标签是在后台直接拼接的html标签，当然在前台一样是可以实现的[/quote我的意思不是跳到分页的第一页，而是跳到选项卡的第一个选项……………………

Answer 12

你这个是把整个页面都刷新了，所以要根据分页的index来重新初始化页面，还有啊，你干嘛要搞个$的函数，你的页面中没有引用jQuery吗，你这个$函数会把jquery的$给那个掉的，我这里也用jQuery的语法帮你初始化页面数据，假设上一次点击的是2，那么根据你上面写的，就是要在页面加载完后需要将第二个选项卡给选中，对吧，以下是jQuery的语法哈，看到你乱用$符号，兴许你不知道jQuery这个框架：//此处是jQuery的事件，页面加载完成后就会执行里面的内容。
$(function(){
//你的页面是jsp，那我假设你把这个pageIndex放在了session或者什么地方，总之是我可以用el表达式直接取到的地方
var pageIndex = ${pageIndex};
//将UL boxNav下的所有li的样式都设置为normaltab，为了保险起见此元素下所有li都清除掉hovertab
$("#boxNav").find("li").addClass("normaltab").removeClass("hovertab");
//根据遍历出来的li元素找到pageIndex对应的元素，jQuery返回的对象都是一个数组，所以即0开始，那么这里要减一。
$("#boxNav").find("li").eq(pageIndex -1).addClass("hovertab").removeClass("normaltab");
//同样的方式设置div的
$("#boxContent").children().addClass("nosee").removeClass("see");
$("#boxContent").children().eq(pageIndex -1).addClass("see").removeClass("nosee");
});以下为jQuery的官网。官网可以下载源码，然后引入你的项目就可以使用这个神奇的$函数了，jQuery的API网上有很多，算是现在最流行的javascript框架
http://jquery.com/