Javascript在新標簽頁中輸入密鑰打開頁面
[英]Javascript enter key opening page in a new tab
問題描述
我正在使用搜索框，並且我嘗試了多種修復方法，所有這些都反映在代碼中。 當您單擊搜索按鈕時，搜索欄將工作並帶您進入搜索頁面，但是，如果您按Enter鍵，它只是將當前頁面的刷新版本拉到新選項卡中。 有人知道解決此問題的方法嗎？
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" type="text/css" href="Main.css">
</head>
<body></body>
<div class="body"></div>
<div class="grad"></div>
<div class="header">
<div>Abuse<span>Caboose</span></div>
</div>
<br />
<br />
<br />
<br />
<a href="login.html">Login</a>
<br />
<br />
<a href="Media_Page.html">Media</a>
<br />
<br />
<a href="Bios.html">Our Team List </a>
<br />
<br />
<a href="ContactUs.html">Contact Us! </a>
<br />
<br />
<img src="http://res.cloudinary.com/lmn/image/upload/e_sharpen:150,f_auto,fl_lossy,q_80/v1/gameskinny/5edfe8862832766bd1c9a38e6a9821eb.jpg" alt="I am Support" title="Image" width="400" height="200" />
<br />
<br />
<br />
<br />
<div id="tfheader">
<form target="_blank">
<div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeypress="return searchit()"></div>
<br />
<a id="searchbutton" href="" onclick="searchit()" target="_blank" onkeypress="return searchit()">Search</a>
</form>
</div>
<script>
const baseUrl = "https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=";
var userurl;
var enterurl;
function urlinput(event){
var text = event.target.value;
text = text.replace(" ", "+");
userurl = text;
var searchButton = document.getElementById('searchbutton').href="baseUrl";
}
function searchit()
{
document.getElementById("searchbutton").href= baseUrl + userurl;
}
</script>
</html>
3 個解決方案
解決方案1
1 已采納 2017-01-27 15:22:23
您的文本框位於表單內，並且在您按Enter鍵時默認情況下正在提交表單。 通過處理onsubmit函數來覆蓋表單的默認提交行為。 如果從此函數返回false，則不會提交表單。
<form target="_blank" onsubmit='return handleSubmit();'>
<div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeypress="return searchit()"></div>
<br />
<a id="searchbutton" href="" onclick="searchit()" target="_blank" onkeypress="return searchit()">Search</a>
</form>
<script>
function handleSubmit() {
return false;
}
</script>
解決方案2
0 2017-01-27 16:14:48
這是一個簡單的修復。 只需刪除form標記，就不需要它了，因為您有Java腳本來處理搜索。 這樣可以解決問題。
解決方案3
0 2017-01-27 16:43:24
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" type="text/css" href="Main.css">
</head>
<body></body>
<div class="body"></div>
<div class="grad"></div>
<div class="header">
<div>Abuse<span>Caboose</span></div>
</div>
<br />
<br />
<br />
<br />
<a href="login.html">Login</a>
<br />
<br />
<a href="Media_Page.html">Media</a>
<br />
<br />
<a href="Bios.html">Our Team List </a>
<br />
<br />
<a href="ContactUs.html">Contact Us! </a>
<br />
<br />
<img src="http://res.cloudinary.com/lmn/image/upload/e_sharpen:150,f_auto,fl_lossy,q_80/v1/gameskinny/5edfe8862832766bd1c9a38e6a9821eb.jpg" alt="I am Support" title="Image" width="400" height="200" />
<br />
<br />
<br />
<br />
<div id="tfheader">
<form>
<div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeydown="newSearchit();"></div>
<br />
<a id="searchbutton" href="" onclick="searchit()" onkeypress="return searchit()">Search</a>
</form>
</div>
<script>
const baseUrl = "https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=";
var userurl;
var enterurl;
function urlinput(event){
var text = event.target.value;
text = text.replace(" ", "+");
userurl = text;
var searchButton = document.getElementById('searchbutton').href="baseUrl";
}
function searchit()
{
//alert('Inhere');
document.getElementById("searchbutton").href= baseUrl + userurl;
}
function newSearchit()
{
if(event.keyCode == 13) {
document.getElementById("searchbutton").click();
}
}
</script>
</html>
試試這個！！！
Javascript Android Mozilla無法在新標簽頁中打開頁面
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.