实现 单击一个文本框 弹出一个窗口，在这个窗口选择数据，然后在将这个数据返回到文本框

RT

解决方案 »

  1.   

    假设文本框ID叫 txtWbk
    那么在弹出的窗口，选了数据之后，触发的事件就是window.opener.document.getElementById("txtWbk
    ").value="你选中的数据";
      

  2.   

    这是我写的一个1-99 的数字选择器。用的是div。参考一下selectNumber.jsfunction Numbers(){
    this.colors = {
    'td_word_light' : '#333333',
    'td_bg_out'     : '#EFEFEF',
    'td_bg_over'    : '#FFCC00',
    'tr_bg'         : '#DCEFFF'
      }
    this.dateControl=null;
    this.drawPanel();
    this.bingEvent();
    }Numbers.prototype.drawPanel=function(){
    var panelObj=document.createElement('div');
    var panelHtml=new Array();
    panelObj.id='div_Numbers';
    panelObj.style.width='100px';
    panelObj.style.height='200px';
    panelObj.style.display='none';
    panelHtml.push('<div id="div_DateBody" Anchor="lif_Num">'+this.drawBody()+'</div>');
    panelHtml.push('</div>');
    panelObj.innerHTML=panelHtml.join('');
    document.body.appendChild(panelObj);
    } 
     
    Numbers.prototype.drawBody=function(){
    numbers = this;
    var sbTab=new Array();
    sbTab.push('<table Anchor="lif_Num" class="Cal" id="tab_Numbers" width="150"   border="1" cellpadding="0" cellspacing="0" >');
    for(var i = 0; i < 10;i++){
    sbTab.push('<tr align="center">');
    for(var j = 0; j < 10; j++) {
    if((i*10+j+1)<100){
    sbTab.push('<td>'+(i*10+j+1)+'</td>');
    }else{
    sbTab.push('<td>&nbsp;</td>');
    }
    }
    sbTab.push('</tr>');
    }
    sbTab.push('</table>');
    return sbTab.join('');
    }
     
    Numbers.prototype.bingEvent=function(){
    var numbers = this;
      
      var tdsDays=$ID('tab_Numbers').getElementsByTagName('td');
     
    for(var i=0; i<tdsDays.length; i++){
    tdsDays[i].style.backgroundColor = numbers.colors['td_bg_out'];
    tdsDays[i].style.color = numbers.colors['td_word_light'];
    if(tdsDays[i].innerHTML!='100' && tdsDays[i].innerHTML!='&nbsp;'){
    tdsDays[i].onclick = function () {
            if(numbers.dateControl != null){
    inputObj=numbers.dateControl;
             numbers.dateControl.value = this.innerHTML;
    numbers.hideCal();
            }
          }
    tdsDays[i].onmouseover = function () {
    this.style.backgroundColor = numbers.colors['td_bg_over'];
    }
    tdsDays[i].onmouseout = function () {
    this.style.backgroundColor = numbers.colors['td_bg_out'];
    }
    }
    }
    }
    Numbers.prototype.getAbsPoint = function (e){
      var x = e.offsetLeft;
      var y = e.offsetTop;
      while(e = e.offsetParent){
        x += e.offsetLeft;
        y += e.offsetTop;
      }
      return {'x': x, 'y': y};
    }Numbers.prototype.showCal=function(dateControl){
    this.dateControl=dateControl;
    var popControl = dateControl;
    inputObj=dateControl;
    targetObj=dateControl;
    this.panel= $ID('div_Numbers');

    var xy = this.getAbsPoint(popControl);
    this.panel.style.position='absolute';
    this.panel.style.left =xy.x + 'px';
    this.panel.style.top = (xy.y + dateControl.offsetHeight) + 'px';
    this.panel.style.display = ''; 
     
    }Numbers.prototype.hideCal = function(){
    var obj = $ID('div_Numbers');
    obj.style.display = 'none';
    };//调用放在了双击的事件，自己修改成单击事件
    test.html <input type="text" id="txt_0" name="text_Num" ondblclick="new Numbers().showCal(this);"/>
      

  3.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function showwin(){
    open("t.html");
    //showModalDialog("t.html");
    }
    //-->
    </SCRIPT>
    </HEAD><BODY>
    姓名：<input name="name" id="name" /><button onclick="showwin()">...</button>
    </BODY>
    </HTML>
      

  4.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function selval(obj){
    var tdobj = obj.parentNode.previousSibling;
    var val = tdobj.innerHTML;
    try{
    window.opener.document.getElementById("name").value = val;
    }catch(e){
    document.getElementById("name").value = val;
    }
    }
    //-->
    </SCRIPT>
    </HEAD><BODY>
    <table border="1">
    <tr>
    <th>姓名</th><th>操作</th>
    <tr>
    <tr>
    <td>张三</td><td><button onclick="selval(this)">选择</button></td>
    </tr>
    <tr>
    <td>李四</td><td><button onclick="selval(this)">选择</button></td>
    </tr>
    </table>
    </BODY>
    </HTML>
      

  5.   

    test1.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
     </HEAD> <BODY>
      <INPUT id="txtWbk" TYPE="text" NAME="" value="点我" onclick="window.open('test2.html');">
     </BODY>
    </HTML>test2.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
     </HEAD> <BODY>
      <div id="a" onclick="window.opener.document.getElementById('txtWbk').value=this.innerHTML;window.close();" style="cursor:pointer">点击我，我的值被带回父页了</div>
     </BODY>
    </HTML>
      

  6.   

    Web 开发常用手册JScript语言参考.rar
    http://download.csdn.net/source/308916DHTML参考手册.rar
    http://download.csdn.net/source/308913样式表中文手册.chm
    http://download.csdn.net/source/304124
      

  7.   

    http://hi.baidu.com/fishsoftdotnet/blog/item/1f87ed386a2456cbd4622543.html