点击input，弹出一个div，div的位置在input下方,div的宽度与input一致

Question

求大神指教，没啥思路，不知道该咋写.
求大神指教，没啥思路，不知道该咋写.
求大神指教，没啥思路，不知道该咋写.

Answer 1

 <style>#pop{position:absolute;border:solid 1px #000;min-height:200px}</style>
<input type="text" style="width:300px" onclick="showPop(this)" />
<script>
    function getPos(ipt) { var p = { x: 0, y: 0 }; do { p.x += ipt.offsetLeft; p.y += ipt.offsetTop; } while (ipt = ipt.offsetParent);return p }
    function showPop(ipt) {
        var pop = document.getElementById('pop');
        if (!pop) {
            var p = getPos(ipt);
            pop = document.createElement('div'); pop.id = 'pop';
            pop.style.cssText = 'left:' + p.x + 'px;top:' + (p.y + ipt.offsetHeight) + 'px;width:' + (ipt.offsetWidth-2) + 'px';
            document.body.appendChild(pop);pop.innerHTML='<input type="button" onclick="this.parentNode.style.display=\'none\'" value="关闭"/>'
        }
        pop.style.display='block'
    }
</script>