仿校内网的高级搜索,在input输入框中点击弹出div且把值传回到text文本框

我也想啊...但是现在我需要一个功能,就是在文本框或者按钮上点击弹出个div出来,选择到值后又要传回文本框....不知道该怎么入手......

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

这个是用js来完成的,你可以把校内的页面另存到你本地,分析他里面的js.可以搬到你网站上用的
隐藏一个div,然后点击的时候显示,选择值就可以用js来做
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn" lang="zh-cn">
<head>
<title>弹出层</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-cn" />
<meta name="robots" content="all" />
<meta name="author" content="penglewen" />
<meta name="copyright"    content="www.oneways.cn" />
<meta http-equiv="imagetoolbar" content="no" />
<style type="text/css">
body {
    text-align: center;
    color: #000;
    margin: 0 auto;
    padding: 0;
    font: 12px Verdana,Tahoma,sans-serif,Arial,宋体;
    line-height: 1.6em;
    background: #69a11c;
    letter-spacing: 1.4px;
    }
* { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,p { display: block; text-align: left; }
table { border: 0; margin: 0; padding: 0; border-collapse : collapse; }
img { border: 0; }
a { text-decoration: none; color: #000; }
a:hover { color: #c00; text-decoration: none; }#wrap {
    text-align: center;
    margin: 0 auto ;
    padding: 50px 0 ;
    width: 300px;
    background: #ccc;
    }
#showBox {
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99;
    width: 100%;
    height: 100%;
    }
#msleft {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1002;
    width: 100%;
    height: 100%;
    }
#alphaBox {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background: #000;
    filter:alpha(opacity=60);   /* IE */
    opacity: 0.6;   /* 支持CSS3的浏览器（FF 1.5也支持）*/
    -moz-opacity: 0.6; /* Moz + FF */
    }
#content {
    color: #416f02;
    margin: 0 auto;
    margin-top: 150px;
    width: 400px;
    height: 200px;
    padding-left: 50px;
    border: 10px solid #ff7e02;
    background-color: #fff;
    }
#content h2 { font-size: 22px; color: #c00; padding: 10px 0; text-align: center; }
#content a { color: #416f02; }
#content a:hover { color: #c00; }.intro{ color: #c27006; }
.close { text-align: right; height: 20px; margin: 20px 20px 0 0; }
</style>
<script type="text/javascript">

</script>
</head>
<body>
<div id="wrap">
    <input type="text" name="code" id="code" /> <input type="button" onclick="boxAlpha();" value="弹出取值" />
</div>
<div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 取值<br /><br /><br /><br />
</div><div id="showBox" style="display:none;">
    <div id="msleft">
        <div id="content">
            <h2>弹出取值</h2>
            <a onclick="document.getElementById('code').value='值1';boxAlpha();" style="cursor:pointer">值1</a><Br/>
            <a onclick="document.getElementById('code').value='值2';boxAlpha();" style="cursor:pointer">值2</a><Br/>
            <a onclick="document.getElementById('code').value='值3';boxAlpha();" style="cursor:pointer">值3</a><Br/>
            <a onclick="document.getElementById('code').value='值4';boxAlpha();" style="cursor:pointer">值4</a><Br/>
            <a onclick="document.getElementById('code').value='值5';boxAlpha();" style="cursor:pointer">值5</a><Br/>
            <a onclick="document.getElementById('code').value='值6';boxAlpha();" style="cursor:pointer">值6</a><Br/>
            <p class="close"><input type="button" name="button" onclick="boxAlpha();" value="关闭" />
        </div>
    </div>
    <div id="alphaBox"></div>
</div>
</body>
</html>