js写的一个浮动窗体，窗体上有多个input 及两个按钮（确定，取消），如何写按钮点击事件，并且如何在点击确定按钮后把该窗体的input值传到父窗体（asp.net页面）。然后父窗体获取值存入数据库

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html>
<head>
<title>DIV制作浮在页面的窗口</title>
<style type='text/css'>
<!--
a:visited{text-decoration:none;color:slategray;}
a:hover{text-decoration:underline;color:slategray;}
a:link{text-decoration:none;color:slategray;}
-->
</style></head>
<body onselectstart='return false' oncontextmenu='return false' scroll='no'>
<script language=JScript>
<!--
//可以打包为js文件;
var x0=0,y0=0,x1=0,y1=0;
var offx=6,offy=6;
var moveable=false;
var hover='orange',normal='slategray';//color;
var index=10000;//z-index;
//开始拖动;
function startDrag(obj)
{
if(event.button==1)
{
//锁定标题栏;
obj.setCapture();
//定义对象;
var win = obj.parentNode;
var sha = win.nextSibling;
//记录鼠标和层位置;
x0 = event.clientX;
y0 = event.clientY;
x1 = parseInt(win.style.left);
y1 = parseInt(win.style.top);
//记录颜色;
normal = obj.style.backgroundColor;
//改变风格;
obj.style.backgroundColor = hover;
win.style.borderColor = hover;
obj.nextSibling.style.color = hover;
sha.style.left = x1 + offx;
sha.style.top  = y1 + offy;
moveable = true;
}
}
//拖动;
function drag(obj)
{
if(moveable)
{
var win = obj.parentNode;
var sha = win.nextSibling;
win.style.left = x1 + event.clientX - x0;
win.style.top  = y1 + event.clientY - y0;
sha.style.left = parseInt(win.style.left) + offx;
sha.style.top  = parseInt(win.style.top) + offy;
}
}
//停止拖动;
function stopDrag(obj)
{
if(moveable)
{
var win = obj.parentNode;
var sha = win.nextSibling;
var msg = obj.nextSibling;
win.style.borderColor     = normal;
obj.style.backgroundColor = normal;
msg.style.color           = normal;
sha.style.left = obj.parentNode.style.left;
sha.style.top  = obj.parentNode.style.top;
obj.releaseCapture();
moveable = false;
}
}
//获得焦点;
function getFocus(obj)
{
if(obj.style.zIndex!=index)
{
index = index + 2;
var idx = index;
obj.style.zIndex=idx;
obj.nextSibling.style.zIndex=idx-1;
}
}
//最小化;
function min(obj)
{
var win = obj.parentNode.parentNode;
var sha = win.nextSibling;
var tit = obj.parentNode;
var msg = tit.nextSibling;
var flg = msg.style.display=="none";
if(flg)
{
win.style.height  = parseInt(msg.style.height) + parseInt(tit.style.height) + 2*2;
sha.style.height  = win.style.height;
msg.style.display = "block";
obj.innerHTML = "0";
}
else
{
win.style.height  = parseInt(tit.style.height) + 2*2;
sha.style.height  = win.style.height;
obj.innerHTML = "2";
msg.style.display = "none";
}
}
//关闭;
function cls(obj)
{
var win = obj.parentNode.parentNode;
var sha = win.nextSibling;
win.style.visibility = "hidden";
sha.style.visibility = "hidden";
}
//创建一个对象;
function xWin(id,w,h,l,t,tit,msg)
{
index = index+2;
this.id      = id;
this.width   = w;
this.height  = h;
this.left    = l;
this.top     = t;
this.zIndex  = index;
this.title   = tit;
this.message = msg;
this.obj     = null;
this.bulid   = bulid;
this.bulid();
}
//初始化;
function bulid()
{
var str = ""
+ "<div id=xMsg" + this.id + " "
+ "style='"
+ "z-index:" + this.zIndex + ";"
+ "width:" + this.width + ";"
+ "height:" + this.height + ";"
+ "left:" + this.left + ";"
+ "top:" + this.top + ";"
+ "background-color:" + normal + ";"
+ "color:" + normal + ";"
+ "font-size:12px;"
+ "font-family:Verdana;"
+ "position:absolute;"
+ "cursor:default;"
+ "border:2px solid " + normal + ";"
+ "' "
+ "onmousedown='getFocus(this)'>"
+ "<div "
+ "style='"
+ "background-color:" + normal + ";"
+ "width:" + (this.width-2*2) + ";"
+ "height:20;"
+ "color:white;"
+ "' "
+ "onmousedown='startDrag(this)' "
+ "onmouseup='stopDrag(this)' "
+ "onmousemove='drag(this)' "
+ "ondblclick='min(this.childNodes[1])'"
+ ">"
+ "<span style='width:" + (this.width-2*12-4) + ";padding-left:3px;'>" + this.title + "</span>"
+ "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='min(this)'>0</span>"
+ "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='cls(this)'>r</span>"
+ "</div>"
+ "<div style='"
+ "width:100%;"
+ "height:" + (this.height-20-4) + ";"
+ "background-color:white;"
+ "line-height:14px;"
+ "word-break:break-all;"
+ "padding:3px;"
+ "'>" + this.message + "</div>"
+ "</div>"
+ "<div style='"
+ "width:" + this.width + ";"
+ "height:" + this.height + ";"
+ "top:" + this.top + ";"
+ "left:" + this.left + ";"
+ "z-index:" + (this.zIndex-1) + ";"
+ "position:absolute;"
+ "background-color:black;"
+ "filter:alpha(opacity=40);"
+ "'>by wildwind</div>";
document.body.insertAdjacentHTML("beforeEnd",str);
}
//-->
</script><script language='JScript'>
<!--
function initialize()
{ //var a = new xWin("1",160,200,200,200,"货物信息列表","b");
var b = new xWin("2",240,200,100,100,"商品信息","&nbsp;商品名称:&nbsp;&nbsp;<input name=\"WareName\" class=\"input1\" type=\"text\"><br>&nbsp;商品编号:&nbsp;&nbsp;<input name=\"WareID\" class=\"input1\" type=\"text\"><br>&nbsp;计量单价:&nbsp;&nbsp;<input name=\"price\" class=\"Unit\" type=\"text\"><br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;单价:&nbsp;&nbsp;<input name=\"Price\" class=\"input1\" type=\"text\">");
//var c = new xWin("3",200,160,250,50,"Copyright","Copyright by <a href=http://www.qpsh.com>http://www.qpsh.com</a>!");
  
}
window.onload = initialize;
//--></script></body>
</html>

解决方案 »

  1.   

    确定按钮加onClick事件
    onClick="javascript:Checked();"function Checked(){
     document.getElementById("父窗口控件id").value=document.getElementsByName("WareName").value;
     ...
    }提交可以直接触发form提交，或者ajax也可以呀
      

  2.   

    不行啊  var b = new xWin("2",240,200,100,100,"商品信息","&nbsp;商品名称:&nbsp;&nbsp; <input name=\"WareName\" class=\"input1\" type=\"text\"> <br>&nbsp;商品编号:&nbsp;&nbsp; <input name=\"WareID\" class=\"input1\" type=\"text\"> <br>&nbsp;计量单价:&nbsp;&nbsp; <input name=\"price\" class=\"Unit\" type=\"text\"> 这句里的WareName等用document.getElementsByName("WareName")点后面没有value，document.getElementById("WareName")点后面也没有value。
      

  3.   

    弹出窗体可以提供接口。例如：在弹出页面有一个<input type=text value=aaa />  <input id=t type=button value=ok/>t.onclick = function(){ 
    if(document.xxx)
    document.xxx(text.value);  //如果弹出页面里有Iframe 的话，就是用parent.xxx(text.value);
    };xxx是页面的方法，把text.value传入。
    只要把页面里定义好这个方法就Ok了。function xxx(v){
    document.getElementById('你想要在页面里赋值的对象和变量') = value;}
      

  4.   


    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> 
    <head> 
    <title>DIV制作浮在页面的窗口 </title> 
    <style type='text/css'> 
    <!-- 
    a:visited{text-decoration:none;color:slategray;} 
    a:hover{text-decoration:underline;color:slategray;} 
    a:link{text-decoration:none;color:slategray;} 
    --> 
    </style> </head> 
    <!--body onselectstart='return false' oncontextmenu='return false' scroll='no'--> 
    <body> 
    <script language=JScript> 
    <!-- 
    //可以打包为js文件; 
    var x0=0,y0=0,x1=0,y1=0; 
    var offx=6,offy=6; 
    var moveable=false; 
    var hover='orange',normal='slategray';//color; 
    var index=10000;//z-index; 
     
    function startDrag(obj) { //开始拖动;
    if(event.button==1) { 
    //锁定标题栏; 
    obj.setCapture(); 
    //定义对象; 
    var win = obj.parentNode; 
    var sha = win.nextSibling; 
    //记录鼠标和层位置; 
    x0 = event.clientX; 
    y0 = event.clientY; 
    x1 = parseInt(win.style.left); 
    y1 = parseInt(win.style.top); 
    //记录颜色; 
    normal = obj.style.backgroundColor; 
    //改变风格; 
    obj.style.backgroundColor = hover; 
    win.style.borderColor = hover; 
    obj.nextSibling.style.color = hover; 
    sha.style.left = x1 + offx; 
    sha.style.top  = y1 + offy; 
    moveable = true; 
    } 
    } function drag(obj) {//拖动;  
    if(moveable) { 
    var win = obj.parentNode; 
    var sha = win.nextSibling; 
    win.style.left = x1 + event.clientX - x0; 
    win.style.top  = y1 + event.clientY - y0; 
    sha.style.left = parseInt(win.style.left) + offx; 
    sha.style.top  = parseInt(win.style.top) + offy; 
    } 
    } 
    //停止拖动; 
    function stopDrag(obj) { 
    if(moveable) { 
    var win = obj.parentNode; 
    var sha = win.nextSibling; 
    var msg = obj.nextSibling; 
    win.style.borderColor    = normal; 
    obj.style.backgroundColor = normal; 
    msg.style.color          = normal; 
    sha.style.left = obj.parentNode.style.left; 
    sha.style.top  = obj.parentNode.style.top; 
    obj.releaseCapture(); 
    moveable = false; 
    } 
    } 
    //获得焦点; 
    function getFocus(obj) { 
    if(obj.style.zIndex!=index) { 
    index = index + 2; 
    var idx = index; 
    obj.style.zIndex=idx; 
    obj.nextSibling.style.zIndex=idx-1; 
    } 
    } 
     
    function min(obj) {//最小化; 
    var win = obj.parentNode.parentNode; 
    var sha = win.nextSibling; 
    var tit = obj.parentNode; 
    var msg = tit.nextSibling; 
    var flg = msg.style.display=="none"; 
    if(flg) { 
    win.style.height  = parseInt(msg.style.height) + parseInt(tit.style.height) + 2*2; 
    sha.style.height  = win.style.height; 
    msg.style.display = "block"; 
    obj.innerHTML = "0"; 
    } 
    else { 
    win.style.height  = parseInt(tit.style.height) + 2*2; 
    sha.style.height  = win.style.height; 
    obj.innerHTML = "2"; 
    msg.style.display = "none"; 
    } 
    } 
     
    function cls(obj){ //关闭;
    var win = obj.parentNode.parentNode; 
    var sha = win.nextSibling; 
    win.style.visibility = "hidden"; 
    sha.style.visibility = "hidden";
    } 
     
    function xWin(id,w,h,l,t,tit,msg){//创建一个对象; 
    index = index+2; 
    this.id      = id; 
    this.width  = w; 
    this.height  = h; 
    this.left    = l; 
    this.top    = t; 
    this.zIndex  = index; 
    this.title  = tit; 
    this.message = msg; 
    this.obj    = null; 
    this.bulid  = bulid; 
    this.bulid(); 
    } 
    //初始化; 
    function bulid() { 
    var str = "" 
    + " <div id=xMsg" + this.id + " " 
    + "style='" 
    + "z-index:" + this.zIndex + ";" 
    + "width:" + this.width + ";" 
    + "height:" + this.height + ";" 
    + "left:" + this.left + ";" 
    + "top:" + this.top + ";" 
    + "background-color:" + normal + ";" 
    + "color:" + normal + ";" 
    + "font-size:12px;" 
    + "font-family:Verdana;" 
    + "position:absolute;" 
    + "cursor:default;" 
    + "border:2px solid " + normal + ";" 
    + "' " 
    + "onmousedown='getFocus(this)'>" 
    + " <div " 
    + "style='" 
    + "background-color:" + normal + ";" 
    + "width:" + (this.width-2*2) + ";" 
    + "height:20;" 
    + "color:white;" 
    + "' " 
    + "onmousedown='startDrag(this)' " 
    + "onmouseup='stopDrag(this)' " 
    + "onmousemove='drag(this)' " 
    + "ondblclick='min(this.childNodes[1])'" 
    + ">" 
    + " <span style='width:" + (this.width-2*12-4) + ";padding-left:3px;'>" + this.title + " </span>" 
    + " <span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='min(this)'>0 </span>" 
    + " <span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='cls(this)'>r </span>" 
    + " </div>" 
    + " <div style='" 
    + "width:100%;" 
    + "height:" + (this.height-20-4) + ";" 
    + "background-color:white;" 
    + "line-height:14px;" 
    + "word-break:break-all;" 
    + "padding:3px;" 
    + "'>" + this.message + " </div>" 
    + " </div>" 
    + " <div style='" 
    + "width:" + this.width + ";" 
    + "height:" + this.height + ";" 
    + "top:" + this.top + ";" 
    + "left:" + this.left + ";" 
    + "z-index:" + (this.zIndex-1) + ";" 
    + "position:absolute;" 
    + "background-color:black;" 
    + "filter:alpha(opacity=40);" 
    + "'>by wildwind </div>"; 
    document.body.insertAdjacentHTML("beforeEnd",str); 
    } 
    //--> 
    </script> <script language='JScript'> 
    <!-- 
    function initialize(){ 
    //var a = new xWin("1",160,200,200,200,"货物信息列表","b"); 
    //var c = new xWin("3",200,160,250,50,"Copyright","Copyright by <a href=http://www.qpsh.com>http://www.qpsh.com </a>!"); 
    var b = new xWin("2",240,200,100,100,"商品信息","&nbsp;商品名称:&nbsp;&nbsp; <input name='WareName' class='input1' type='text'> <br>&nbsp;商品编号:&nbsp;&nbsp; <input name='WareID' class='input1' type='text'> <br>&nbsp;计量单价:&nbsp;&nbsp; <input name='price' class='Unit' type='text'> <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;单价:&nbsp;&nbsp; <input name='Price' class='input1' type='text'>"); 
    }/*---caiying2009--*/
    var outPut2
    function initInput(){
    outPut2=[];setInput(2,outPut2)
    }
     
    function setInput(n,_a){
    var obj_con=document.getElementById("xMsg"+n)
    var obj_input=obj_con.getElementsByTagName("input"),j=obj_input.length
    for (var i=0;i<j;i++)obj_input[i].onblur=function(){_a[_a.length]=[this.name,this.value]};//请自己设定数组元素内容－－这里是演示
    }
    window.onload = function(){initialize();initInput()} 
    /*---caiying2009--*///--> </script> 
    <input type=button value=test_2 onclick="alert(outPut2)" title="请自己设定对outPut2的应用，
    包括输入验证、
    传值到父窗对应对象等
    －－这里是演示"/> 
    </body> 
    </html>