如何完成自定义浏览器新选项卡的html代码



我认识的人正在浏览网页,每次他们打开一个新的选项卡,就会打开一个完全空白的主页,可以在新打开的页面上自由键入。无论他们最终键入了什么,他们都会按Enter键,它就会像在浏览器地址栏中键入一样进行搜索。

我问他们是怎么做到的,他们给了我这个代码:

;html{overflow:hidden;}我试图模仿他们的做法,将其保存为html文件并用浏览器打开,但它只会打开一个完全空白的页面,我无法键入任何内容。所以我认为,当他们给我代码时,它被切断了,因为我们正在使用的聊天中有字符限制。有人知道如何完成这件事才能做到我所描述的他们所做的吗。每次打开新标签时,我都想为自己复制它。

感谢任何能提供帮助的人!

您只需要输入整个页面大小的文本,当您按enter键时,窗口位置应该只是文本输入的内容。

对于URL搜索

var text = document.getElementById("text");
document.addEventListener("keyup", function(event) {
if (event.keyCode === 13) {
event.preventDefault();
window.location = "https://" + text.value; 
}
});
html
{
padding:0;
margin: 0;
overflow:hidden;
}
textarea
{
outline: none;
border:none;
resize: none;
width: 100vw;
height: 100vh;
}
<html>
<textarea autofocus id="text"></textarea>
</html>

对于谷歌搜索

document.getElementById("search").addEventListener( "keypress", function( event ){
if( event.keyCode === 13 )
{
event.preventDefault();
window.location = "https://google.com/search?q=" + encodeURI( this.value );
}

})
html,body {
padding: 0;
margin: 0;
overflow:hidden;
}
#search {
width: 100vw;
height: 100vh;
border: none;
outline: none;
font-size: 30px;
text-align: center;
}
<html>
<head>
<title>&#65279;</title>
</head>
<body>
<input id = "search" autofocus>
</body>
</html>

最新更新