高分求js脚本
想在网页上加个效果,类似网易新闻分类标签那样
移动到某个标签就下面的div就显示该分类的新闻列表
我实现是这样的
一次将几个分类新闻都取出来,分别放在几个隐藏的div里
然后写个脚本控制鼠标划过不同的分类标签的时候,在同一个位置显示不同的div
这个脚本可把握给弄晕了
写了一下午也没搞好
那位大大帮帮忙,资料也可
多谢
[解决办法]
帮顶,听听下面的同仁的实现思路先..!~
[解决办法]
可以把网易主站打开,看看其源代码如何,也许会有想法!
[解决办法]
http://www.mx68.com/webdesign/2006-03-08/webdesign_10740.shtml
[解决办法]
http://www.mx68.com/webdesign/2006-03-08/webdesign_10740.shtml
[解决办法]
<SCRIPT LANGUAGE= "JavaScript ">
<!--
//参数vote_id,vote,User_group
function castVote(vote_id,vote,User_group) {
//传递参数给后台程序处理文件
var url = "vt_do.asp?vote_id= "+vote_id+ "&vote= "+vote+ "&User_group= "+User_group+ " ";
var callback = processAjaxResponse;
executeXhr(callback, url);
this.disabled=true;
}
function executeXhr(callback, url) {
// branch for native XMLHttpRequest object
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = callback;
req.open( "GET ", url, true);
req.send(null);
} // branch for IE/Windows ActiveX version
else if (window.ActiveXObject) {
req = new ActiveXObject( "Microsoft.XMLHTTP ");
if (req) {
req.onreadystatechange = callback;
req.open( "GET ", url, true);
req.send();
}
}
}
function processAjaxResponse() {
// only if req shows "loaded "
if (req.readyState == 4) {
// only if "OK "
if (req.status == 200) {
//str接收程序返回的字符串(可以直接传回HTML代码.)
var str=new String(req.responseText)
//document.write ( " "+str+ " ")
//判断传回的值,做相应处理。0是特殊情况,数据库读写错误等,自己在程序里约定。
if (str!= "0 ")
{
//我传回的是一个JS语句,所以用eval直接执行。你可以改成document.all.XXX.innerHTML
//xxx是你的DIV名
eval( " "+str+ " ");
}
} else {
alert( "对不起,服务器正忙,请稍后再试\n ");
}
}
}
//-->
</SCRIPT>
页面调用:
<input type= 'radio ' value=3 class=radio name= 'Vote ' onclick=castVote( "&Rs_show( "vote_ID ")& ",3, "&User_group& ")>
这是我为单位OA写的一个投票系统的投票界面的部分代码,因为是多用户对多项目投票,项目很多,并且要求限制单个用户投出的优秀票数,为了系统的友好和易用,不可能让用户提交数据后再判断,必须即点即判断。
这里用到了XMLHttpRequest();用户每次点击选择都会从服务器判断一次。
原理就是触发JS程序发送请求给相关程序,程序返回一个字符串,再根据字符串修改页面。
你的情况比我简单,只要把我用中文注释的地方改一下就可以了。
[解决办法]
<div id= "divTab1 " onmouseover= "showContent(1) "> Tab 1 </div>
<div id= "divTab2 " onmouseover= "showContent(2) "> Tab 2 </div>
<div id= "divContent1 " style= "display:none ">
News 1 <br />
News 2 <br />
News 3 <br />
</div>
<div id= "divContent2 " style= "display:none ">
News 4 <br />
News 5 <br />
News 6 <br />
</div>
<script>
function showContent(index)
{
for (var i = 1 to 2)
{
document.getElementById( "divContent " + i).style.display = "none ";
}
document.getElementById( "divContent " + index).style.display = " ";
}
</script>
========
没有用ajax,因为在你这个例子里,显然ajax的响应速度不够快
[解决办法]
ajax响应速度是比不上直接把数据全部读取出来,但是ajax可以保证数据的即时性,如果在用户尚未刷新页面的情况下,数据有了变动,你的这种方法是反应不了的。
[解决办法]
各有利弊,选择何种手法看需求。
[解决办法]
直接用ajax的TabContainer控件 效率、效果都好,ajax也是js实现的
例子:http://ajax.asp.net/ajaxtoolkit/Tabs/Tabs.aspx
[解决办法]
已经发出,请查看是否有误