怎么使列表框里的滚动条在刷新或操作后位置保持不变
日期：2014-05-16 浏览次数：20460 次
如何使列表框里的滚动条在刷新或操作后位置保持不变
有一个select列表框,高度是10,但其中的option有20个,所有列表框里有滚动条,当我用Javascript选中列表其中一个内容,然后使其到了另一个框体,这时滚动条又回到了最上面,有什么办法可以使他保持在原来的位置吗?
------解决方案--------------------
记住scrollTop属性就可以了。
<html>
<head>
<script>
function restore(){
var s = document.cookie;
var a = s.split( "; ");
var b, r= " ";
for(var i=0;i <a.length;i++){
b = a[i].split( "= ");
if(b[0]== "s "){r=b[1];break;}
}
if(r != " "){
a = r.split( "- ");
var sel = document.form1.sel;
sel.scrollTop = a[0]
sel.selectedIndex = a[1];
}
}
function doit(){
var sel = document.form1.sel;
document.cookie = "s= " + sel.scrollTop + "- " + sel.selectedIndex;
}
</script>
</head>
<body onload= "restore(); ">
<form name= "form1 ">
<select name= "sel " size= "5 " multiple= "multiple " onchange= "doit(); ">
<option> 00000 </option>
<option> 00001 </option>
<option> 00002 </option>
<option> 00003 </option>
<option> 00004 </option>
<option> 00005 </option>
<option> 00006 </option>
<option selected= "selected "> 00007 </option>
<option> 00008 </option>
<option> 00009 </option>
<option> 00010 </option>
<option> 00011 </option>
<option> 00012 </option>
<option> 00013 </option>
</select>
<form>
</body>
</html>
有一个select列表框,高度是10,但其中的option有20个,所有列表框里有滚动条,当我用Javascript选中列表其中一个内容,然后使其到了另一个框体,这时滚动条又回到了最上面,有什么办法可以使他保持在原来的位置吗?
------解决方案--------------------
记住scrollTop属性就可以了。
<html>
<head>
<script>
function restore(){
var s = document.cookie;
var a = s.split( "; ");
var b, r= " ";
for(var i=0;i <a.length;i++){
b = a[i].split( "= ");
if(b[0]== "s "){r=b[1];break;}
}
if(r != " "){
a = r.split( "- ");
var sel = document.form1.sel;
sel.scrollTop = a[0]
sel.selectedIndex = a[1];
}
}
function doit(){
var sel = document.form1.sel;
document.cookie = "s= " + sel.scrollTop + "- " + sel.selectedIndex;
}
</script>
</head>
<body onload= "restore(); ">
<form name= "form1 ">
<select name= "sel " size= "5 " multiple= "multiple " onchange= "doit(); ">
<option> 00000 </option>
<option> 00001 </option>
<option> 00002 </option>
<option> 00003 </option>
<option> 00004 </option>
<option> 00005 </option>
<option> 00006 </option>
<option selected= "selected "> 00007 </option>
<option> 00008 </option>
<option> 00009 </option>
<option> 00010 </option>
<option> 00011 </option>
<option> 00012 </option>
<option> 00013 </option>
</select>
<form>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
