我的思路是，在 title 里面传递url地址，然后当调用把 title 转移给 popup的innerHMTL时，产生ajax请求，请求完成后，修改事件源对象的ajaxContent属性，并用这个属性来保存请求的值，以避免鼠标移动重复请求。
请仔细对比我修改的代码。
顺便提一句：ajax不支持跨域请求，如果是请求自己域内页面，是没有问题的，如果想获得baidu.com首页内容是不可能的，这个时候就只能用iframe来实现了！如果楼主是要跨域请求，那么还是换成iframe.我也提供里一个Iframe函数，只要替换一下调用就可用了。
附上全部代码：
给分！
<script type="text/javascript">
function MQ_QPopup()
{
this.pFontFamily='verdana'
this.pFontSize='12px'
this.pFontColor='#030303'
this.pBgColor='#f8f8f8'
this.pBorder='1px #000000 solid'
var pOpacityIE='80'
var pOpacityFF=0.8
this.init=function()
{ var style="position:absolutez-index:1000visibility:hiddenpadding:3pxword-break:keep-all"
style+="font-family:'"+this.pFontFamily+"'"
style+="font-size:"+this.pFontSize+""
style+="color:"+this.pFontColor+""
style+="background-color:"+this.pBgColor+""
style+="border:"+this.pBorder+""
var html="<div id='MQ_popupLayer' style=\""+style+"\"></div>"
document.write(html)
}
this.doit=function(evt)
{ evt=(evt)?(evt):(window.event)?(window.event):""
var o=(evt.target)?(evt.target):(evt.srcElement)
var mouseX=(evt.x)?(evt.x):(evt.pageX-document.body.scrollLeft)
var mouseY=(evt.y)?(evt.y):(evt.pageY-document.body.scrollTop)
if(o.title!='' &&o.title!=null)
{ o.popupText=o.title
o.title=''
}
else if(o.alt!='' &&o.alt!=null)
{ o.popupText=o.alt
o.alt=''
}
var divPopupText=document.getElementById('MQ_popupLayer')
divPopupText.style.filter="alpha(opacity="+pOpacityIE+")"//ie
divPopupText.style.opacity=pOpacityFF//firefox
if (o.popupText!='' &&o.popupText!=null)
{ divPopupText.style.visibility='visible'
divPopupText.style.left=mouseX+15+document.body.scrollLeft
divPopupText.style.top=mouseY+15+document.body.scrollTop
//divPopupText.innerHTML=o.popupText这里的内容就不用再显示了，去掉
// o.popupText 里面存放请求的URL地址。 把这个地址拿出来用AJAX来请求。
// 为了避免移动鼠标产生的多次请求，把请求完成后的内容放入到 对象的一个属性里面。
// 如果不存在ajaxContent属性，证明还没有产生请求
if(!o.ajaxContent){
new Ajax( o.popupText ,o)
// Iframe( o.popupText ,o)如果是跨域跨请求，用iframe来实现
divPopupText.innerHTML = o.ajaxContent
//否则已经产生过请求，那么直接把内容放到提示框内就可以了。
}else{ divPopupText.innerHTML=o.ajaxContent }
}
else
{ divPopupText.style.left=0
divPopupText.style.top=0
divPopupText.style.visibility='hidden'
}
if(divPopupText.offsetWidth+mouseX>document.body.clientWidth)
divPopupText.style.left=document.body.clientWidth-divPopupText.offsetWidth
if(divPopupText.offsetHeight+mouseY>document.body.clientHeight)
divPopupText.style.top=document.body.clientHeight-divPopupText.offsetHeight
}
}
var MQ_popupObj=new MQ_QPopup()
MQ_popupObj.init()
document.onmousemove=MQ_popupObj.doit
function Ajax(url,obj)
{
var request=null
if( window.XMLHttpRequest ) { request=new XMLHttpRequest()}
else if( window.ActiveXObject ){ request=new ActiveXObject("Microsoft.XMLHttp")}
if(request){
request.open("GET", url , true)
request.onreadystatechange = function(){
if(request.readyState==4 &&request.status==200)
{
obj.ajaxContent =request.responseText
}else{
obj.ajaxContent ="Loading...."
}
}
request.send(null)
}
}
function Iframe(url,obj)
{
obj.ajaxContent='<iframe src="'+url+'" frameborder="0" width="100%" height="100%"></iframe>'
}
</script>
<body>
<center>
<div class="mainborder">
<img src="http://img.baidu.com/img/logo-zhidao.gif" width=50 border=2 title="a.htm">
<!-- 建议楼主在当前目录下写一个静态页面 a.htm 测试一下，绝对可用 -->
</div>
<span id="test"></span>
</center>
</body></html>
可以直接load()到div里，或ajax({
url:文件路径，
success:function(res){
//把res当内容付给div
div.html(res)
}
})
这是一个我用了 bingo 框架写的ajax 和你的要求差不多了,为了简单说明,我将默认显示"a.php"的个删除------------------------------------------
1.先导入一个现成的ajax框架,我这里推荐用bingo,虽然网上有好多更强大的,但我觉得这个足以应付大部份的 *** 作的内容,你可以在这里下载得到,
http://www.ajaxbingo.com/
而且是中文的,非常亲切哦,dw cs4里也对他有代码提示
<script src="bingo.js"></script>
2.建一个function让来处理鼠标滑过连接时的 *** 作
将划过的连接的ID作为判断,ajax要访问那一个文件再将得到的结果交给function "ch2"
<script>
function ch(val){
AJAXCALL(val+".php",ch2)
}
3.返回的结果显示在指定的ID的div里头,
function ch2(doc){
$("downurl").innerHTML=doc
}
</script>
------------------------------------------
<a href="#" id="a" onmouseover="ch(this.id)">LINK A</a>| <a href="#" id="b" onmouseover="ch(this.id)">LINK B </a>
<div id="downurl"></div>
-----------------------------------------
其实这个切换页的功能你可以直接在dw cs3 cs4里找到,不需要自己编写
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）