弹出窗口如何实现

Question

需求描述：
在页面上以列表方式显示查询结果， 其中有一列ColumnA，当鼠标停留在ColumnA的任意一行时，在当前位置弹出窗口，显示与当前值相关的信息，显示的信息是通过Ajax请求服务器得到的， 鼠标离开，弹出窗口消失。请教关于弹出窗口部分如何实现？ 最好有现成的代码。Thanks.

Answer 1

举个例子：
<script language="JavaScript" for="对象" event="事件"> 
... 
(事件处理程序代码) 
... 
</script> <script language="JavaScript" for="window" event="onload"> 
alert('网页读取完成，请慢慢欣赏！'); 
</script> 
你可以根据你要显示的内容作修改，这里只是事例
你参考以下

Answer 2

下面是一个使用onMouseOver事件的例子。当onMouseOver事件被脚步侦测到时，就会弹出一个警告框： <a href="http://www.cncms.com.cn" 
onmouseover="alert(’An onMouseOver event’);return false"> <img src="cncms.gif" width="100" height="30"> </a>
你可以修改以下，把上面写的综合起来就可以了

Answer 3

如果用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莫属了

Answer 4

jquery能够很简单的实现blockui，也就是div层，自己具体的要求就要自己来修改了

Answer 5

用JavaScript很容易实现吧，找本哪方面的书看看吧