怎样关闭这样的div

wen1818 2008-12-31 05:32:08

内容：文本框+Div

描述：在文本框中输入字符，异步调用服务器端数据，在文本框下方弹出div以供选择，但这个div里面有分页功能和检索功能

要实现的功能：当焦点不在div和这个文本框时，自动关闭这个div

难点：当点击div里面的内容时，文本框将失去焦点，因此不能通过该文框的onblur来关闭div，那通过什么事件来触发这个关闭事件呢？怎样关闭它呢？

紧急求救！！

...全文

146 14 打赏收藏转发到动态举报

写回复

用AI写文章

14 条回复

切换为时间正序

请发表友善的回复…

发表回复

wen1818 2009-01-04

打赏
举报

虽然在firfox下不能使用，但还是非常感谢syukugai ，我再改一下应该就可以了

Thank you!

messagewanted 2008-12-31

打赏
举报

不好意思，是srcElement

messagewanted 2008-12-31

打赏
举报

文本框的onpropertychange事件触发DIV显示
鼠标点击事件中，DIV会隐藏，分集中情况,引用eventSource判断，事件源是DIV、文本框还是页面其他部分。
点击DIV时，DIV将点击的项放入文本框内。
点击文本框时，DIV显示情况不变。
点击页面其他部分，DIV隐藏。

不悲不喜 2008-12-31

打赏
举报

<html lang="utf-8" xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

        <title></title>

        <style>

        </style>

    </head>

    <script language="JavaScript">

        function $(id){

            return (document.getElementById(id));

        }

        

        function test(evt){

			if(!$('div1')||$('div1').style.display=='none'){

				return;

			}

            var e = window.event || e;

            var o = e.srcElement || e.target;

            while (o) {

                if (o == $("div1")) {

                    return;

                }

                o = o.parentNode;

            }

//            alert("hi! you should close the div1!")

			$('div1').style.display='none';

        }

        

        window.onload = function(){

            document.onblur = document.onmousedown = document.onkeyup = test;

        }

    </script>

    <body>

    	<input type="button" value="show div" onclick="$('div1').style.display='block';"><br>

        <input type="text" value=""><br>

		<input type="text" value=""><br>

        <div id="div1" align="center" style="background:blue;position:absolute;left:300px;top:200px;width:300px;height:200px;overflow:auto;display:none;">

            <br>

			<p>

                测试一下<input type="text" vlaue="">

                <br>

                测试一下<input type="text" vlaue="">

                <br>

            </p>

        </div>

    </body>

</html>

不悲不喜 2008-12-31

打赏
举报

你可以在document.onmousedown还有document.onkeyup事件中来做。然后判断一下事件激发的对象是不是在div内部。这样就可以了。

yangshenghong 2008-12-31

打赏
举报

给DIV注册一个onmouseover事件,看可以不？

Jarvis-Li 2008-12-31

打赏
举报

应该可以用定时来实现，

不悲不喜 2008-12-31

打赏
举报

给你提供几个方案
(1) 在onblur事件中判断一下 toElement (FF下是 relatedTarget)是不是在DIV中，
如果不是则关闭DIV。IE下有一上函数 obj.contains();可以用来进行判断。
不多说了，这个有很多的例子可以参考。

(2)如果只是IE下的话，还可以用createPopup()
当弹出窗口失去焦点的时候系统会自动关闭弹出窗口。

wen1818 2008-12-31