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

summily 2009-12-10 09:07:10

...全文

179 12 打赏收藏转发到动态举报

写回复

用AI写文章

12 条回复

切换为时间正序

请发表友善的回复…

发表回复

yixianggao 2009-12-10

打赏
举报

Web 开发常用手册

JScript语言参考.rar
http://download.csdn.net/source/308916

DHTML参考手册.rar
http://download.csdn.net/source/308913

样式表中文手册.chm
http://download.csdn.net/source/304124

woshifou 2009-12-10

打赏
举报

学习。

ljzloveyj 2009-12-10

打赏
举报

我也很期待这种JS，有的能共享一下嘛~

ITDC_YiWang 2009-12-10

打赏
举报

[Quote=引用 2 楼 jol_boy 的回复:]
假设文本框ID叫 txtWbk
那么在弹出的窗口，选了数据之后，触发的事件就是window.opener.document.getElementById("txtWbk
").value="你选中的数据";
[/Quote]

正解

jol_boy 2009-12-10

打赏
举报

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>

licip 2009-12-10

打赏
举报

<!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">

</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>

licip 2009-12-10

打赏
举报

风沙不去驼铃声 2009-12-10

打赏
举报

这是我写的一个1-99 的数字选择器。用的是div。参考一下

selectNumber.js

function 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> </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!=' '){
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);"/>

summily 2009-12-10