2013-02-10 80 views
0

當我在我的網站上運行這個腳本時,搜索工作正常,但是當你點擊iframe中的鏈接時,iframe消失,看到我的網站http://gigster.webege.com上的真實工作示例,它位於右上角的文本框中。謝謝你提前JavaScript Iframe不會工作

<script> 
mouseover = false; 

function searchFocus() { 
i = document.getElementById("searchResults"); 
i.style.display = "block"; 
i.onmousemove = function() { 
    mouseover = true; 
} 
i.onmouseout = function() { 
    mouseover = false; 
} 
} 
function searchBlur() { 
if (mouseover) { 
    return; 
} 
document.getElementById("searchResults").style.display = "none"; 
} 

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> 
<body> 
<input oninput="updateIframe(this.value)" onBlur = "searchBlur()" onFocus = "searchFocus(this)" size="31" maxlength="255" style="height: 24px;" placeholder="Search..." type="text"> 
<iframe id="searchResults" style="display:none;background-color:white;" height="100%" width="100%"></input></iframe> 
</body> 

找到了更好的SOLOUTION如果你需要請與我聯繫

+0

javascript對此很麻煩。 – 2013-02-10 20:09:48

+0

你更好的解決方案是什麼? – Stephen 2013-02-11 23:53:23

回答

0

我得到了它的jsfiddle在這裏工作:http://jsfiddle.net/FjXyj/1/

我唯一改變的是rearragne你的HTML這樣的iframe不在輸入標籤內:

<input oninput="updateIframe(this.value)" onBlur="searchBlur()" onFocus="searchFocus()" 
size="31" maxlength="255" style="height: 24px;" placeholder="Search..." 
type="text" /> 
<iframe id="searchResults" style="display:none;background-color:white;" 
height="100%" width="100%"></iframe> 

並在您的updateIframe函數中添加最後一個}。

該iframe似乎功能,並且在您點擊它時不會消失。

+0

該問題仍然occours ..也許是因爲我的CSS我有我會發布我的CSS下面。 – 2013-02-10 22:21:25

+0

http://jsfiddle.net/Z2s96/我把我的代碼放在這裏 – 2013-02-10 22:27:41

+0

我編輯了一下代碼 – 2013-02-10 22:32:08