1. 在京东的首页中通过查看源找到搜索框的代码如下
这是通过js来操作提交的。onclick="search('key');return false;" 。点击搜索会触发search()函数，把key传递过去，再处理数据提交。
2. 如何用javascript实现搜索功能
http://www.w3school.com.cn/ajax/ajax_asp_php.asp
可以看看这个，跟楼上说的一样，用ajax发送请求到服务器端做检索返回结果插内入到容页面中。
3. 百度搜索框代码
目前网络上还没有能同时满足着2个功能的，可能要找网络合作吧
网络官方有开放的搜索框代码，不过高度和样式都不能调整（最简单的)，但能提供搜索提示。
4. 静态网页中如何用js实现搜索功能
我的理解:
当前页面只显示一个按钮和一个文本框
新开一个页面,专门用来显示结果
以下内容为在网上找到的搜索代码
<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<!--＃i nclude file="manage/inc/config.asp"-->
<!--＃i nclude file="inc/conn.asp"-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>爱T发明书店</title>
<link href="/blog/style.css" rel="stylesheet" type="text/css">
</style>
<!-- European format dd-mm-yyyy -->
<script language="JavaScript" src="/blog/calendar.js"></script>
</head>
<body>
<!--＃i nclude file="head.htm"-->
<table width="780" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="219" align="left" valign="top"><!--＃i nclude file="left.asp"--></td>
<td width="561" align="left" valign="top">
<br> <script language=javascript>
var whitespace = " \t\n\r";
function IsWhitespace (s)
{
var i;
if (IsEmpty(s)) return true;
for (i = 0; i < s.length; i++)
{
var c = s.charAt(i);
if (whitespace.indexOf(c) == -1) return false;
}
return true;
}
function IsEmpty(s)
{
return ((s == null) || (s.length == 0))
}
function IsDate(fDate)
{
var arrDaysInMonth=new Array(12);
arrDaysInMonth[1]=31;
arrDaysInMonth[2]=29;
arrDaysInMonth[3]=31;
arrDaysInMonth[4]=30;
arrDaysInMonth[5]=31;
arrDaysInMonth[6]=30;
arrDaysInMonth[7]=31;
arrDaysInMonth[8]=31;
arrDaysInMonth[9]=30;
arrDaysInMonth[10]=31;
arrDaysInMonth[11]=30;
arrDaysInMonth[12]=31;
if (IsEmpty(fDate))
return true
var NameList=fDate.split("-");
if (NameList.length!=3)
return false
if (!(IsYear(NameList[0]) && IsMonth(NameList[1]) && IsDay(NameList[2])) )
return false
if ( NameList[1]>arrDaysInMonth[NameList[1]] )
return false
if ( (NameList[1]==2) && (NameList[2]>DaysInFebruary(NameList[0]) ) )
return false
return true
}
function search()
{
var name = document.forms['frmdata'].elements['name'].value;
var author = document.forms['frmdata'].elements['author'].value;
var manufacturer = document.forms['frmdata'].elements['manufacturer'].value;
var smallprice = document.forms['frmdata'].elements['smallprice'].value;
var largeprice = document.forms['frmdata'].elements['largeprice'].value;
var enabledate = document.forms['frmdata'].elements['enabledate'].value;
var expiredate = document.forms['frmdata'].elements['expiredate'].value;
if (!IsWhitespace(enabledate))
{
if (!IsDate(enabledate))
{
alert("出版日期 开始日期格式错误!");
return false;
}
}
if (!IsWhitespace(expiredate))
{
if (!IsDate(expiredate))
{
alert("出版日期 结束日期格式错误!");
return false;
}
}
var allNotEmpty = (!IsWhitespace(name)) ||
(!IsWhitespace(author)) ||
(!IsWhitespace(manufacturer)) ||
(!IsWhitespace(smallprice)) ||
(!IsWhitespace(largeprice))||
(!IsWhitespace(enabledate)) ||
(!IsWhitespace(expiredate));
if (!allNotEmpty)
{
alert("必需输入一个搜索条件");
return false;
}
if (!IsWhitespace(smallprice))
{
if (!IsPlusNumeric(smallprice))
{
alert("价格数据不合法");
return false;
}
}
if (!IsWhitespace(largeprice))
{
if (!IsPlusNumeric(largeprice))
{
alert("价格数据不合法");
return false;
}
}
if ((!IsWhitespace(enabledate)) && (!IsWhitespace(expiredate)))
{
if (enabledate>expiredate)
{
alert("出版日期范围错误");
return false;
}
}
if ((!IsWhitespace(smallprice)) && (!IsWhitespace(largeprice)))
{
if (parseFloat(smallprice)>parseFloat(largeprice))
{
alert("价格范围错误");
return false;
}
}
}
</script> <br> <table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img src="/blog/images/w.gif"></td>
<td style="color:#415373">搜索图书</td>
</tr>
</table> <br> <FORM name=frmdata method=get action="rsearch.asp">
<TABLE cellSpacing=10 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD align=right width="31%" height=30>商品名称：</TD>
<TD width="69%"><INPUT name=name class="inputstyle">
</TD>
</TR>
<TR>
<TD align=right width="31%" height=30>作者名称：</TD>
<TD width="69%"><INPUT name=author class="inputstyle">
</TD>
</TR>
<TR>
<TD align=right width="31%" height=30>出版社：</TD>
<TD width="69%"><INPUT name=manufacturer class="inputstyle">
</TD>
</TR>
<TR>
<TD align=right width="31%" height=28>出版时间：</TD>
<TD vAlign=center width="69%"><INPUT name=enabledate class="inputstyle" size=12>
<a
href="javascript:cal1.popup();"><img height=16 alt=点击选择日期
src="/blog/images/cal.gif" width=16 border=0></a> 至
<INPUT name=expiredate class="inputstyle" size=12>
<a
href="javascript:cal2.popup();"><img height=16 alt=点击选择日期
src="/blog/images/cal.gif" width=16 border=0></a> <script language=JavaScript>
var cal1 = new calendar1(document.forms['frmdata'].elements['enabledate']);
cal1.year_scroll = true;
cal1.time_comp = false;
var cal2 = new calendar1(document.forms['frmdata'].elements['expiredate']);
cal2.year_scroll = true;
cal2.time_comp = false;
</script></TD>
</TR>
<TR>
<TD align=right width="31%" height=30>价格范围：</TD>
<TD width="69%"> <input name="smallprice" type="text" id="smallprice" size="5" >
至
<input name="largeprice" type="text" id="largeprice"
size="5" >
</TD>
</TR>
<TR>
<TD align=right height=30>分类：</TD>
<TD><select name=code>
<option value="" selected>所有图书</option>
<%
set rs=server.CreateObject("adodb.recordset")
rs.open "select * from category",conn,1,1
do while not rs.eof
%>
<option value="<%=rs("categoryid")%>" ><%=rs("category")%></option>
<%
rs.movenext
loop
rs.close
set rs=nothing
%>
</select></TD>
</TR>
<TR>
<TD align=right height=30>排序字段：</TD>
<TD><input name="OrderField" type="radio" value="adddate" checked>
添加日期 <input type="radio" name="OrderField" value="proctdate">
出版日期
<input type="radio" name="OrderField" value="price2">
价钱(会员价)
<br>
<br> <input type="radio" name="OrderField" value="vipprice">
价钱(VIP)
<input type="radio" name="OrderField" value="pagenum">
页数<input type="radio" name="OrderField" value="discount">
折扣</TD>
</TR>
<TR>
<TD align=right width="31%" height=30>排序方式：</TD>
<TD width="69%"><input type="radio" name="Order" value="ASC">
升序
<input name="Order" type="radio" value="DESC" checked>
降序</TD>
</TR>
<TR align=center>
<TD height=40 colSpan=2><INPUT type=submit value=开始搜索 name=Submit2 onClick="return search()"> </TD>
</TR>
</TABLE>
</FORM></td>
</tr>
</table>
<!--＃i nclude file="foot.htm"-->
</body>
</html>
5. js如何实现划词搜索分享代码
javascript实现划词标记+划词搜索功能代码实例
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
<html>
<head>
<title>UntitledDocument</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
</head>
<body>
<SCRIPTlanguage=javascript>
<!--
document.body.onload=adddiv;
document.onmousedown=recordobj;
document.ondblclick=dbclick;
document.onmouseup=showselect;
varstarobj,isdb=false,allow=true;
functionisallow()
{
if(allow){
allow=false;
alert('isclosed');
}
else{
allow=true;
alert('isopend');
}
}
functiondbclick()
{
isdb=true;
}
functionrecordobj()
{
starobj=event.srcElement;
}
functionshowselect(){
varstr="";
if(event.srcElement.tagName!="A"&&event.srcElement.tagName!="INPUT"&&event.srcElement==starobj&&!isdb&&allow)
{
varoText=document.selection.createRange();
if(oText.text.length>0)
{
str=oText.text;
oText.text="BuB"+oText.text+"EuE";
}
oText.select();
event.srcElement.innerHTML=event.srcElement.innerHTML.replace("BuB","<ustyle='FONT-WEIGHT:bold;COLOR:#ff3366'>").replace("EuE","</u>");
}
searchgoogle(str)
isdb=false;
}
functionsearchgoogle(str)
{
varobj=document.getElementById("searchgoogle");
if(str.length>0)
{
obj.style.display="block";
obj.style.position="absolute";
obj.style.zindex=999;
obj.style.posTop=document.body.scrollTop+event.y-25;
obj.style.posLeft=document.body.scrollLeft+event.x+5;
obj.style.widht=80;
obj.innerHTML="<atarget=_blankhref=http://www.google.com/search?ie=UTF-8&oe=UTF-8&q="+str+"style='BORDER-RIGHT:royalbluethinsolid;BORDER-TOP:royalbluethinsolid;FONT-WEIGHT:bold;BORDER-LEFT:royalbluethinsolid;CLIP:rect(autoautoautoauto);COLOR:#ffffff;BORDER-BOTTOM:royalbluethinsolid;BACKGROUND-COLOR:inactivecaption;TEXT-DECORATION:none'>SearchIt！</a>";
}
else
{
obj.style.display="none";
}
}
functionadddiv()
{
varmobj=document.createElement("div");
mobj.id="searchgoogle";
document.body.appendChild(mobj);
}
//-->
</SCRIPT>
<INPUTtype="button"onclick="isallow()"value="关闭/打开划词功能">
<p></p>
</body>
</html>
6. JS怎么实现站内搜索功能
一：对文章关键字的搜索（数组的方法）：
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title></title>
<styletype="text/css">
#search{
height:40px;width:200px;font-size:30px;text-align:center;
}
#div{
font-size:20px;width:600px;
}
#divspan{
color:red;
}
</style>
</head>
<body>
<inputtype="text"name="search"id="search"value="馋"onclick="this.value=''"/>
<inputtype="button"name=""id="bbtn"value="搜索"/>
<divid="div">
<p>馋，在英文里找不到一个十分适当的字。罗马暴君尼禄，以至于英国的亨利八世，在大宴群臣的时候，常见其撕下一根根又粗又壮的鸡腿，举起来大嚼，旁若无人，好一副饕餮相！但那不是馋。埃及废王法鲁克，据说每天早餐一口气吃二十个荷包蛋，也不是馋，只是放肆，只是没有吃相。对有某一种食物有所偏好，于是大量的吃，这是贪多无厌。馋，则着重在食物的质，最需要满足的是品味。上天生人，在他嘴里安放一条舌，舌上还有无数的味蕾，教人焉得不馋？馋，基于生理的要求；也可以发展成为近于艺术的趣味。
也许我们中国人特别馋一些。馋字从食，有声。毚音谗，本义是狡兔，善于奔走，人为了口腹之欲，不惜多方奔走以膏馋吻，所谓“为了一张嘴，跑断两条腿”。</p>
</div>
<scripttype="text/javascript">
varbbtn=document.getElementById('bbtn');
varsearch=document.getElementById('search');
vartext=document.getElementsByTagName('p')[0];
vartext1=text.innerHTML;
vararr=[];
varstr=text1;
bbtn.onclick=function(){
str=text1
arr=search.value;
str=str.split(arr).join('<span>'+arr+'</span>');
text.innerHTML=str;
}
</script>
</body>
</html>
二：对li表单的搜索：
<!DOCTYPEhtml>
<html>
<head>
<metacharset="UTF-8">
<title></title>
<styletype="text/css">
*{
padding:0;margin:0;
}
#content{
margin:100px300px;display:block;
}
input{
height:50px;width:400px;font-size:30px;line-height:50px;
}
ul{
}
li{
margin:10px0px;display:block;
}
</style>
</head>
<body>
<divid="content">
<ul>
<inputtype=""name=""id=""value=""placeholder="请输入城市的名称或拼音"/>
<lipname="北京"cname="bj">北京</li>
<lipname="株洲"cname="zz">株洲</li>
<lipname="上海"cname="sh">上海</li>
<lipname="长沙"cname="cs">长沙</li>
<lipname="杭州"cname="hz">杭州</li>
<lipname="天津"cname="tj">天津</li>
<lipname="西安"cname="xa">西安</li>
<lipname="成都"cname="cd">成都</li>
<lipname="武汉"cname="wh">武汉</li>
<lipname="南京"cname="nj">南京</li>
</ul>
</div>
<scripttype="text/javascript">
varli=document.getElementsByTagName('li');
vartext=document.getElementsByTagName('input')[0];
functionsearch(){
vararr=text.value;
for(vari=0;i<li.length;i++)
{
li[i].style.display="none";
if(li[i].getAttribute('pname').indexOf(arr)!=-1||li[i].getAttribute('cname').indexOf(arr)!=-1)
{
li[i].style.display="block";
}
}
}
text.oninput=function(){
search();
}
</script>
</body>
</html>