第一个JS文件内容
$(document).ready(function(){
//标题鼠标经过
$(".DatalistContainer a").mousemove(function(e){
$(".TipDiv").remove();//若页面上有该元素,则移除该元素...0
var x=e.clientX + 10;//获取鼠标的x轴坐标
var y=e.clientY + 10;//获取鼠标的y轴坐标
var num=$(this).attr("id");
var imgs;
var word;
var name;
switch(num)
{
case "001":{ imgs="images/mimi.bmp"; name="资源库" ; word="资源库" ; break; }
case "002":{ imgs="images/mama.bmp"; name="记忆 ." ; word="中国母亲..." ; break; }
case "003":{ imgs="images/nikesong.bmp"; name="故事" ; word="买走赏心悦目!" ; break; }
case "004":{ imgs="images/lqz.bmp"; name="李清照" ; word="没有说教。" ; break; }
}
popDiv(imgs,name,word,x,y);
})
//标题鼠标离开
$(".DatalistContainer a").mouseout(function(){
$(".TipDiv").remove();
})
//时间鼠标经过
$("ul li span").mouseover(function(){
$("#tips").remove();
var elem= $(this).parent();
var mTop=elem.offset().top;//获取该元素的top坐标
var mLeft=elem.offset().left;//获取该元素的left坐标
var addLeft=elem.width();//获取该元素的宽度
var finalTop=mTop-30;//获取最终元素出现的Top位置,此时-30个元素是让箭头指向对应行
var finalleft=mLeft+addLeft+20; // 获取最终元素出现Left的,对应行的左边加上行宽加上20个空元素
var num=$("li").index(elem)+1;
popDiv1(finalTop,finalleft,"提示框提醒你,这是第"+num+"行数据!");
})
})
//随鼠标移动的信息框
function popDiv(face,name,info,xx,yy)
{
var str="";
str+="<div class='TipDiv'>";
str+="<img alt='face' src='"+face+"'/>";
str+="<strong><em>"+name+"</em></strong><br />";
str+="<span>"+info+"</span>";
str+="<div>";
$('body').append(str);
$(".TipDiv").css({"top":yy+"px","left":xx+"px"});//设置该元素出现的位置(这里是出现在鼠标的右边和下边的偏离10px位置)
}//固定的信息框
function popDiv1(tops,lefts,messages)
{
var str="";
str="<div id='tips'><img id='tipsArrow' src='images/arrow.png' alt=''/><img id='close' src='images/close.jpg' alt='' onclick='closeUp()'/><img src='images/light.gif' alt='' id='light'/><p>"+messages+"</p></div>";
$('body').append(str);
$("#tips").css({"top":tops+"px","left":lefts+"px"});
}function closeUp()
{
$("#tips").remove();
}\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
第二个JS文件内容
function ShowNo() //隐藏两个层
{
document.getElementById("doing").style.display="none";
document.getElementById("divLogin").style.display="none";
}
function $(id)
{
return (document.getElementById) ? document.getElementById(id) : document.all[id] ;
}
function showFloat() //根据屏幕的大小显示两个层
{
var range = getRange();
$('doing').style.width = range.width + "px";
$('doing').style.height = range.height + "px";
$('doing').style.display = "block";
document.getElementById("divLogin").style.display="";
}
function getRange() //得到屏幕的大小
{
var top = document.body.scrollTop;
var left = document.body.scrollLeft;
var height = document.body.clientHeight;
var width = document.body.clientWidth; if (top==0 && left==0 && height==0 && width==0)
{
top = document.documentElement.scrollTop;
left = document.documentElement.scrollLeft;
height = document.documentElement.clientHeight;
width = document.documentElement.clientWidth;
}
return {top:top ,left:left ,height:height ,width:width } ;
} 这两个JS文件单独放的话都没问题,可以实现我想要的功能
但是同时在一个页面中引用的话就会报错。'null'为空或不是对象通过dubugger调试发现
执行第一个JS文件的第二行
//标题鼠标经过
$(".DatalistContainer a").mousemove(function(e){
就会跳转到第二个JS文件的function $(id) 这个函数...由于是初学JS 上面的都是百度来的东西...虽然知道问题在哪儿,但不知道怎么样修改才能让这两个函数在同一页面正常工作??麻烦各位前辈了!!!
$(document).ready(function(){
//标题鼠标经过
$(".DatalistContainer a").mousemove(function(e){
$(".TipDiv").remove();//若页面上有该元素,则移除该元素...0
var x=e.clientX + 10;//获取鼠标的x轴坐标
var y=e.clientY + 10;//获取鼠标的y轴坐标
var num=$(this).attr("id");
var imgs;
var word;
var name;
switch(num)
{
case "001":{ imgs="images/mimi.bmp"; name="资源库" ; word="资源库" ; break; }
case "002":{ imgs="images/mama.bmp"; name="记忆 ." ; word="中国母亲..." ; break; }
case "003":{ imgs="images/nikesong.bmp"; name="故事" ; word="买走赏心悦目!" ; break; }
case "004":{ imgs="images/lqz.bmp"; name="李清照" ; word="没有说教。" ; break; }
}
popDiv(imgs,name,word,x,y);
})
//标题鼠标离开
$(".DatalistContainer a").mouseout(function(){
$(".TipDiv").remove();
})
//时间鼠标经过
$("ul li span").mouseover(function(){
$("#tips").remove();
var elem= $(this).parent();
var mTop=elem.offset().top;//获取该元素的top坐标
var mLeft=elem.offset().left;//获取该元素的left坐标
var addLeft=elem.width();//获取该元素的宽度
var finalTop=mTop-30;//获取最终元素出现的Top位置,此时-30个元素是让箭头指向对应行
var finalleft=mLeft+addLeft+20; // 获取最终元素出现Left的,对应行的左边加上行宽加上20个空元素
var num=$("li").index(elem)+1;
popDiv1(finalTop,finalleft,"提示框提醒你,这是第"+num+"行数据!");
})
})
//随鼠标移动的信息框
function popDiv(face,name,info,xx,yy)
{
var str="";
str+="<div class='TipDiv'>";
str+="<img alt='face' src='"+face+"'/>";
str+="<strong><em>"+name+"</em></strong><br />";
str+="<span>"+info+"</span>";
str+="<div>";
$('body').append(str);
$(".TipDiv").css({"top":yy+"px","left":xx+"px"});//设置该元素出现的位置(这里是出现在鼠标的右边和下边的偏离10px位置)
}//固定的信息框
function popDiv1(tops,lefts,messages)
{
var str="";
str="<div id='tips'><img id='tipsArrow' src='images/arrow.png' alt=''/><img id='close' src='images/close.jpg' alt='' onclick='closeUp()'/><img src='images/light.gif' alt='' id='light'/><p>"+messages+"</p></div>";
$('body').append(str);
$("#tips").css({"top":tops+"px","left":lefts+"px"});
}function closeUp()
{
$("#tips").remove();
}\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
第二个JS文件内容
function ShowNo() //隐藏两个层
{
document.getElementById("doing").style.display="none";
document.getElementById("divLogin").style.display="none";
}
function $(id)
{
return (document.getElementById) ? document.getElementById(id) : document.all[id] ;
}
function showFloat() //根据屏幕的大小显示两个层
{
var range = getRange();
$('doing').style.width = range.width + "px";
$('doing').style.height = range.height + "px";
$('doing').style.display = "block";
document.getElementById("divLogin").style.display="";
}
function getRange() //得到屏幕的大小
{
var top = document.body.scrollTop;
var left = document.body.scrollLeft;
var height = document.body.clientHeight;
var width = document.body.clientWidth; if (top==0 && left==0 && height==0 && width==0)
{
top = document.documentElement.scrollTop;
left = document.documentElement.scrollLeft;
height = document.documentElement.clientHeight;
width = document.documentElement.clientWidth;
}
return {top:top ,left:left ,height:height ,width:width } ;
} 这两个JS文件单独放的话都没问题,可以实现我想要的功能
但是同时在一个页面中引用的话就会报错。'null'为空或不是对象通过dubugger调试发现
执行第一个JS文件的第二行
//标题鼠标经过
$(".DatalistContainer a").mousemove(function(e){
就会跳转到第二个JS文件的function $(id) 这个函数...由于是初学JS 上面的都是百度来的东西...虽然知道问题在哪儿,但不知道怎么样修改才能让这两个函数在同一页面正常工作??麻烦各位前辈了!!!
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货