弹出窗口如何实现
需求描述:
在页面上以列表方式显示查询结果, 其中有一列ColumnA,当鼠标停留在ColumnA的任意一行时,在当前位置弹出窗口,显示与当前值相关的信息,显示的信息是通过Ajax请求服务器得到的, 鼠标离开,弹出窗口消失。
请教关于弹出窗口部分如何实现? 最好有现成的代码。
Thanks.
------解决方案--------------------
------解决方案--------------------http://malsup.com/jquery/block/#demos
------解决方案--------------------
举个例子:
<script language="JavaScript" for="对象" event="事件">
...
(事件处理程序代码)
...
</script>
<script language="JavaScript" for="window" event="onload">
alert('网页读取完成,请慢慢欣赏!');
</script>
你可以根据你要显示的内容作修改,这里只是事例
你参考以下
------解决方案--------------------
如果用alert();的方式弹出窗口的话可能不太好。建议用DIV层来做。把DIV样式position设置absolute,为列表上的列添加一个事件处理。
如果那个列表是用table的话,假设为第二列加上这个效果,可以这样实现:
<script type="text/javascript">
var table = document.getElementById("tableId");//假设table的Id为tableId
for (int i = 0; i < table.rows.length; i++) {
var td = table.rows[i].cells(1);//找到第二列
td.onmouseover = function() {
var floatDiv = document.getElementById("divInfo");//假设要弹出的DIV的Id为divInfo
floatDiv.style.left = event.x;
floatDiv.style.top = event.y;
floatDiv.style.display = "block";
}
td.onmouseout = function() {
var floatDiv = document.getElementById("divInfo");//假设要弹出的DIV的Id为divInfo
floatDiv.style.display = "none";
}
}
</script>
至于弹出层中的数据,非AJAX莫属了