自谷歌搜索结果在我的网站 [英] Auto Google Search Results On My Website
问题描述
我在做一个网站。当您点击我的搜索框，输入你点击搜索，然后带你到google.com与如何将我用ajax在一个框架中显示的结果在键入？。当û搜索的 http://google.com 你的类型带来了其自身的结果，而不pressing搜索我怎么能做到这一点的文字？这里是我的HTML代码段
I'm making a website. When you click on my search box and type you click search and then it takes you to google.com with search results how would i use ajax to display results in a frame as you type?.when u search on http://google.com the text you type brings up results by its self without pressing search how can i do this? Here is my html snippet
<div class='search'>
<form method="get" id='search' action="http://www.google.com/search">
<input type="hidden" name="q" size="31" maxlength="255" value="Site Name:" />
<input type="text" name="q" size="31" maxlength="255" style="height: 24px;" placeholder="Search..." />
</div>
我有很多背后的CSS，使文本框放大并改变颜色。这里是片段，以防万一它是相关的。
I have alot of css behind it to make the text box enlarge and change color. Here is the snippet just in case it's relevant.
#search input[type="text"] {
background: url(imgs/search-white.png) no-repeat 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #d7d7d7;
width:150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
outline: none;
}
#search input[type="text"]:focus {
background: url(imgs/search-dark.png) no-repeat 10px 6px #fcfcfc;
color: #6a6f75;
width: 175px;
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
outline: none;
}
div.search
{
position:fixed;
top:8px;
right:5px;
}
所以如何将我作出这样的显示谷歌搜索结果中键入一个Ajax框架？ 我什么都不知道AJAX我不知道如何下手行code与它ither因此，请在深入讲解
so how would i make an ajax frame that displays google search results as you type? i know nothing about ajax i dont know how to start a line of code with it ither so please explain in depth
*侧面说明 对不起，如果网站看起来不好的即时通讯13
*side note sorry if website looks bad im 13
推荐答案
不知道的JavaScript你是pretty的好卡住，我建议先学习它。 w3schools.com 将是一个不错的地方。
Without knowing JavaScript you are pretty well stuck, I recommend learning it first. w3schools.com would be a good place.
谷歌不再允许你使用他们的网站通过iframe中，所以我建议使用startpage.com作为其结果，从google.com
Google no longer lets you use their website through an iframe, so I recommend using startpage.com as their results pull from google.com
这是我能想到的做到这一点最简单的方法是这样的（在这个例子中，我使用本网站的移动版本，因为它嵌入更好。）：的 http://jsfiddle.net/A8M4r/
The simplest way that I can think of to do it is something like this (in this example I use the mobile version of the website as it embeds better.): http://jsfiddle.net/A8M4r/
<!DOCTYPE html>
<html>
<head>
<script>
function querify(query) {
return query.split(" ").join("+") // replaces spaces with +s for url
}
function updateIframe(query) {
query = querify(query);
var i = document.getElementById("searchResults");
var searchEngine = "http://startpage.com/do/m/mobilesearch/?q="
var yourSiteToSearch= "site:example.com+"
i.src = searchEngine + yourSiteToSearch + query;
}
</script>
</head>
<body>
<input oninput="updateIframe(this.value)" type="text">
<iframe id="searchResults" height="100%" width="100%">
</body>
希望这有助于！
Hope this helps!
P.S。如果您想了：其中，iframe中时，只弹出用户点击搜索框有一个在这里：jsfiddle.net/4EDUK
P.S. If you would like one where the iframe only pops up when the user clicks on the search box there is one here: jsfiddle.net/4EDUK
这篇关于自谷歌搜索结果在我的网站的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
