为什么要使用额外的输入元素来创建一个内部网站搜索框(和)

问题描述:

为什么我要使用或需要使用额外的输入元素和隐藏属性来创建一个搜索给定网页的网站搜索框内部网站。为什么要使用额外的输入元素来创建一个内部网站搜索框(和)

<div id="search_box"> 
<form name="searchform" action="http://www.google.com/search" method="get" target="_blank"> 
<input name="sitesearch" type="hidden" value="www.example.com" /> 
<input name="as_q" onfocus="this.value=''" type="text" size="20" value="Search www.example.com" title="Enter your search here" /> 
<input title="Begin Search" type="submit" value="Search" /> 
</form> 
</div> 

而且我真的需要使用JavaScript onfocus="this.value=''"明确的“搜索www.example.com”一旦用户点击它的文本/值。为什么这不起作用,我怀疑是由于一个人不能通过“瞄准”某些“属性”的事实。 CSS,并且给定的HTML属性没有“替代”CSS属性。

input[type="text"]:focus 
{ 
value: ""; 
} 

以上将失败,因为我不能(或我可以?)目标的价值属性!但是,对于像这样的非常小的功能来说,使用Javascript似乎是一个矫枉过正的行为。几乎像使用JS悬停效果而不是CSS伪:悬停。

+1

在这种情况下,您不需要JavaScript。设置'value ='''并使用HTML5属性'placeholder ='搜索www.example.com''。 – some

,或者需要与隐藏的 属性使用额外的输入元素,使网站的搜索框在内部搜索给定网站 。

不知何故,你必须告诉搜索引擎你想限制搜索到一个特定的网站。通常这是通过一个隐藏的输入字段来完成的,因为当表单被提交但是没有显示给用户时,它被包括在内。

然而它并不需要是一个隐藏的元素。你也可以把它放在text,radiobutton,checkboxselect。唯一的要求是,它被发送到名称为“sitesearch”的搜索引擎,并与您选择的网站相关联。

我真的需要使用JavaScript的onfocus =“THIS.VALUE =‘’”清除 的“搜索www.example.com”一旦用户点击它 文本/值。

您可以从头开始设置value=''并使用新的html5属性placeholder='Search www.example.com'。或者在页面上的某处使用描述性文字。

但它似乎是一个矫枉过正的使用Javascript的一个非常小的 功能就像这一个。几乎就像使用JS悬停效果 而不是CSS伪:悬停。

你可能认为它是过度杀伤,但多年来它是唯一的方法。在CSS实现之前很久以前,Javascript已经在浏览器中。悬停效果必须在JavaScript中实现,因为:hover直到CSS2才被引入。这种情况下要使用的占位符效果最近才通过HTML5实现。

这里sitesearch是传递到Google的查询参数,它告诉谷歌搜索一个特定的网站,所以是需要这个属性,并以此为javascript代码, 我想你可以通过CSS3的 content属性上执行同一这将在现代浏览器中工作。

编辑:我尝试使用content但它似乎没有为什么我用工作

+0

您的意思是“内容”:在伪选择器之前和之后? – Jawad