您的位置:首页 > Web前端 > JavaScript

使用javascript进行页面间传值的问题

2007-12-09 20:08 627 查看
最近遇到一个问题,在一个项目中需要输入企业的名称,以便到数据库中找到该企业以便进行相关操作,如果企业名称输入不规范,比如数据库中有多个名为家乐福的商场,包括蜀山区家乐福,包河区家乐福,而用户不能提供准确的信息来查找,因此需要将类似的项目列出来让用户选择,如使用DropDownList下拉列表来实现,数据超过20则无法继续,而在当前页查询又会造成页面不美观,所以需要到另一个页面中查询,查询好后返回到该页面.这就涉及到两个页面间传值的问题,经过查找资料,发现有两种javascript的方法可以解决这个问题.

方法一:

新建两个html文件分别命名为parent.htm和child.htm,下面将在parent.htm中打开child并设置parent中的值


parent.htm


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


<body>


<input id="hidden_Input" type="text" />


<a href="child.htm" target="_blank">Popup Child.htm</a>




</body>


</html>


child.htm


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


<head>




<script type="text/javascript">...


function testme()




...{


var parent = window.parent.opener;


var hiddenInput = parent.document.getElementById('hidden_Input');




if(hiddenInput)




...{


hiddenInput.value = 'show me the money, hahaha';


alert('close this window and see what happens on parent.htm~');


window.close();


}


}


</script>


<title></title>


</head>


<body>


<button onclick="testme();">点击这里设置parent.htm中的值</button>


</body>


</html>





方法二:同样新建两个html文件parent.htm和child.


parent.htm


<html xmlns="http://www.w3.org/1999/xhtml" >


<head>


<title>parent</title>




<script type="text/javascript">...


function inputtext(value)




...{


document.getElementById("tt").value=value;


document.getElementById("tt1").focus();


}


</script>


</head>


<body>


点击输入框设置值<input id="tt" type="text" onfocus="javascript:window.open('child.htm','_blank','scrollbars=yes,status=no,top=20,left=20,width=450,height=211');"/>


<input id="tt1" type="text" />


</body>


</html>


child.htm


<html xmlns="http://www.w3.org/1999/xhtml" >


<head>


<title>child</title>




<script language="javascript" type="text/javascript">...


<!--






function Button1_onclick() ...{


var value = document.getElementById("tt").value;


parent.opener.inputtext(value);


window.close();


}




// -->


</script>


</head>


<body>


<form id="form1" runat="server">


<div>


<input id="tt" type="text"/><input id="Button1" type="button"


value="button" language="javascript" onclick="return Button1_onclick()" />


</div>


</form>


</body>


</html>

在parent.htm中点击第一个input控件就会弹出child.htm输入完成后自动关闭页面给parent中的input控件赋值,并将焦点移到下一个控件
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐