百度bing一塊兒搜——框架顯示

總結: javascript

1. frameset、frame組合使用,頁面中不能有body。因此我不得不新建一個searchFrame.html文件存放search代碼。 css

2. iframe則不一樣,能夠放在body中。但不知怎地,除了Chrome,IE、FF均不能顯示正常效果(搜索結果不能返回到其相應的iframe中)。 html

 BaiGooHu.html: java

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>BaiGooHu.html</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

	</head>

	<!--<body style="text-align: center;">
		-->
	<frameset rows="10%,90%">
		<frame src="searchFrame.html">
		</frame>
		<frameset cols="45%,45%">
			<frame id="baiduFrame" name="baiduFrame" src="images/1.jpg"></frame>
			<frame id="bingFrame" name="bingFrame" src="images/1.jpg"></frame>
		</frameset>
	</frameset>


	<!--<iframe id="baiduFrame" width="49%" height="100%" ></iframe>
		<iframe id="bingFrame" width="49%" height="100%"  ></iframe>
	</body>-->
</html>

 

searchFrame.html: ui

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>searchFrame.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
		<script type="text/javascript">
function $(id) {
	return document.getElementById(id);
}
function mixSearch() {
	var okeyword = $("keyword");
	var oForm = $("searchForm");
	//提交給百度,構造地址參數
	oForm.action = "http://www.baidu.com/s";
	okeyword.name = "wd";
	oForm.method = "get";
	oForm.target = "baiduFrame";
	oForm.submit();
	//提交給bing,構造地址參數
	oForm.action = "http://hk.bing.com/search";
	okeyword.name = "q";
	oForm.method = "get";
	oForm.target = "bingFrame";
	oForm.submit();
}
</script>
  </head>
  
  <body style="text-align: center;">
   <form action="" id="searchForm" method="get" target="baiduFrame">
			<input type="text" id="keyword" name="wd" />
			<input type="button" value="搜一下~" onclick="mixSearch();" />
		</form>
		<hr />

  </body>
</html>
相關文章
相關標籤/搜索