1,html部分

<form method="get" action="#" name="headSearchForm" id="headSearchForm" οnsubmit="return headDoSearch();">

<input id="headSearchType" name="searchType" type="hidden" value="userSearch">

<div class="selSearch">

<div class="nowSearch" id="headSlected" οnmοuseοver="if(document.getElementById('headSel').style.display=='none'){document.getElementById('headSel').style.display='block';}else {document.getElementById('headSel').style.display='none';};return false;" οnmοuseοut="drop_mouseout('head');">用户</div>

<div class="btnSel"><a href="#" οnmοuseοver="if(document.getElementById('headSel').style.display=='none'){document.getElementById('headSel').style.display='block';}else {document.getElementById('headSel').style.display='none';};return false;" οnmοuseοut="drop_mouseout('head');"></a></div>

<div class="clear"></div>

<ul class="selOption" id="headSel" style="display:none;">

<li><a href="#" οnclick="return search_show('head','userSearch',this)" οnmοuseοver="drop_mouseover('head');" οnmοuseοut="drop_mouseout('head');">用户</a></li>

<li><a href="#" οnclick="return search_show('head','tagSearch',this)" οnmοuseοver="drop_mouseover('head');" οnmοuseοut="drop_mouseout('head');">话题</a></li>

</ul>

</div>

<input class="txtSearch" id="headq" name="headSearchValue" type="text" value="请输入关键字" οnfοcus="this.value=''"/>

<div class="btnSearch">

<a href="#" οnclick="javascript:return headDoSearch();"><span class="lbl">搜索</span></a>

</div>

</form>

2，js部分

//头部搜索

function drop_mouseover(pos){

 try{window.clearTimeout(timer);}catch(e){}

}

function drop_mouseout(pos){

 var posSel=document.getElementById(pos+"Sel").style.display;

 if(posSel=="block"){

  timer = setTimeout("drop_hide('"+pos+"')", 1000);

 }

}

function drop_hide(pos){

 document.getElementById(pos+"Sel").style.display="none";

}

function search_show(pos,searchType,href){

    document.getElementById(pos+"SearchType").value=searchType;

    document.getElementById(pos+"Sel").style.display="none";

    document.getElementById(pos+"Slected").innerHTML=href.innerHTML;

    document.getElementById(pos+'q').focus();

 try{window.clearTimeout(timer);}catch(e){}

 return false;

}

function headDoSearch() {

 var searchValue = $('#headq').val();

 var searchType = $('#headSearchType').val();

 var redirectURL = '';

 

 if(''==searchValue || 'undefined'==searchValue || '请输入关键字'==searchValue) {

  alert("请输入关键字");

 } else {

  if('userSearch'==searchType ) {

   redirectURL = 'index.php?mod=profile&code=search&keyword='+searchValue;

  } else if ('tagSearch'==searchType ) {

   redirectURL = 'index.php?mod=tag&code='+searchValue;

  } else {

   alert("未定义的操作");

  }

  

  if(''!=redirectURL) {

   window.location.href=redirectURL;

  }

 }  

 return false;

}

 

3，样式部分

/*头部搜索*/

.searchTool{width:175px; margin:0;}

.searchTool .txtSearch{float:left;width:80px;padding:2px;height:16px;border:1px solid #ccc; color:#999;background:#fff;}

.searchTool .selSearch{float:left;width:49px;background:#fff;height:20px;line-height:20px;border:1px solid #ccc;border-right:0;}

.searchTool .nowSearch{float:left;width:30px;height:20px;line-height:21px;overflow:hidden;padding-left:4px;background:#fff;cursor:pointer;}

.searchTool .btnSel{float:right;border-left:1px solid #ccc;width:14px;height:20px;background:#fff;}

.searchTool .btnSel a{background:url(../images/t1/header_s1.gif) no-repeat center center;display:block;width:14px;height:20px;}

.searchTool .selOption{z-index:9999; _position:absolute;margin-left:2px;+margin-left:-1px;_margin-left:-1px;width:48px;background:#fff;border:1px solid #ccc; padding:0; overflow:hidden;}

.searchTool .selOption a{display:block;height:21px;padding-left:5px;line-height:21px;color:#000; width:39px;}

.searchTool .selOption a:hover{color:#fff;background:#ccc;}

.searchTool .btnSearch{float:left;margin-left:1px;width:35px;height:21px;line-height:21px;overflow:hidden;text-align:center;}

.searchTool .btnSearch a{background:url(../images/t1/sBtn_bg.gif) repeat-x;display:block;text-decoration:none;height:21px;line-height:21px;overflow:hidden;}

.searchTool .btnSearch .lbl{cursor:pointer; color:#FFF; }