[b]tooltip 显示框 ,用ajax获取提示信息 [/b]
1.载入
2.前台显示
displayed="0" 为了只获取一次信息 ,减少重复的请求。
3.js代码
4.后台ajax返回的数据
5.效果图
[img]http://dl.iteye.com/upload/attachment/171515/8f9d09a0-5a3e-3629-9a04-f556fae33013.jpg[/img]
这个是 我开发一个游戏的时候 客户给的
1.载入
<script type="text/javascript" src="/javascripts/custom_boxover.js"></script>
<script type="text/javascript" src="/javascripts/prototype.js"></script>
<script src="/javascripts/castle/get_building_info.js" language="javascript"></script>
2.前台显示
<a id="b<%=b.id%>" href="javascript:void(0)" onclick="upgrade_info('msg1',<%=b.id%>);hideBox();showTooltip=0;" title="header=[<%=b.name%>] body[]" onmouseover="get_building_tooltip(this,<%=b.id%>)" displayed="0"></a>
displayed="0" 为了只获取一次信息 ,减少重复的请求。
3.js代码
function get_building_tooltip(element,b_id){
var attributes=element.attributes;
var displayed=attributes.getNamedItem("displayed").value;
if(parseInt(displayed)==0){
b_id=parseInt(b_id);
new Ajax.Request('/test/index',{
method: 'get',
parameters: {overview_b_id: b_id},
onSuccess: function(transport){
var info=transport.responseText.split('#;#');
var header=info[0];
var body=info[1];
element.boBDY=body;
element.boHDR=header;
element.hasBox=1;
element.title='';
if(showTooltip)
showBox();
attributes.getNamedItem("displayed").value=1;
}
});
}
}
4.后台ajax返回的数据
class TestController < ApplicationController
def index
render :text => 'aaaaaaa #;# bbbbbb'
end
end
5.效果图
[img]http://dl.iteye.com/upload/attachment/171515/8f9d09a0-5a3e-3629-9a04-f556fae33013.jpg[/img]
这个是 我开发一个游戏的时候 客户给的