`
kevin-qingzhan
  • 浏览: 84805 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

搜索输入框

阅读更多
1.打开页面,输入框自动获得焦点
2.用户输入关键词,如果是第一次输入,则自动清空默认Value值



<!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
<head>
<title> Code:关于搜索输入框 </title>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<meta name="author" content="枫岩,http://www.cnlei.com">
<meta name="keywords" content="自动获得焦点,自动清空默认Value" />
<meta name="description" content="打开页面,输入框自动获得焦点;用户输入关键词,如果是第一次输入,则自动清空默认Value值" />
<script language="javascript">
function clearInp(o){
  if (o.className=="firstInp"){
   o.className="doInp";
   o.value="";
  }
}
</script>
<style type="text/css" media="all">
.firstInp {color:#999;}
.doInp {color:#f60;}
</style>
</head>
<body onload="document.serchform.k.focus();">
<form name="serchform" method="get" action="">
<input name="k" size="35" class="firstInp" value="请输入关键字" maxlength="100" onkeydown="clearInp(this);" />
<input type="submit" value="搜索" />
</form>
</body>
</html>
分享到:
评论

相关推荐

    安卓搜索相关相关-如何用Android实现搜索输入框的动画效果.rar

    在Android应用开发中,搜索输入框的动画效果是提升用户体验的重要一环。用户在与界面交互时,流畅的动画能够使操作更具吸引力和趣味性。本资料“安卓搜索相关相关-如何用Android实现搜索输入框的动画效果.rar”提供...

    Asp.Net+Ajax控键实现搜索输入框智能提示功能源码

    在Asp.Net开发中,利用Ajax技术可以极大地提升用户体验,特别是在实现搜索输入框的智能提示功能时,Ajax的优势尤为明显。这个"WebSite2"压缩包文件提供的源码就是一个很好的例子,展示了如何将Asp.Net与Ajax控件结合...

    搜索输入框关键词联想提示

    在构建一个交互式的Web应用程序时,搜索输入框的关键词联想提示功能是一个常用且重要的特性。这一功能能够提高用户的搜索效率,提供便捷的用户体验。本文将深入探讨如何实现"搜索输入框关键词联想提示",主要围绕...

    一个类似GOOGLE搜索输入框的AJAX小程序

    【标题】"一个类似GOOGLE搜索输入框的AJAX小程序"是基于AJAX技术实现的交互式搜索功能,旨在提供用户在输入查询时无需刷新页面即可获取搜索结果的体验,类似于谷歌搜索引擎的实时搜索建议。这个小程序的核心在于利用...

    仿百度/Google搜索输入框提示JS代码(PHP+MySql数据库版)

    在构建Web应用时,搜索功能是必不可少的一部分,而仿百度/Google搜索输入框提示功能则可以极大地提升用户体验。这个功能通常被称为自动补全或搜索建议,它能够在用户输入搜索关键词时,实时显示与之相关的搜索建议。...

    HTML5搜索输入框下拉列表代码.zip

    HTML5的搜索输入框下拉列表是网页设计中一种常见的交互元素,主要用于提供用户友好的搜索体验。在本示例中,"HTML5搜索输入框下拉列表代码.zip" 文件包含了一个实现这一功能的代码库,它利用了HTML5、CSS和jQuery...

    HTML5实现搜索输入框下拉列表代码.zip

    在创建搜索输入框下拉列表时,首先我们需要一个`&lt;input&gt;`元素,它通常作为用户输入的字段,然后通过`list`属性关联到`&lt;datalist&gt;`元素。`&lt;datalist&gt;`元素内部包含一系列的`&lt;option&gt;`元素,这些选项将在用户输入时...

    带搜索输入框的下拉选

    自定义美化的,带搜索输入框的下拉选,样式可自行修改,项目引入需要的文件即可。 自定义美化的,带搜索输入框的下拉选,样式可自行修改,项目引入需要的文件即可。 自定义美化的,带搜索输入框的下拉选,样式可自行...

    百度地图根据关键字搜索输入框提示热词

    【标题】:“百度地图根据关键字搜索输入框提示热词”是指在Android应用开发中,使用百度地图API实现用户在搜索框输入时,自动显示与关键字相关的热门搜索词或建议搜索词的功能。这一功能提升了用户体验,使得用户能...

    Asp.Net+控件简单实现搜索输入框智能提示功能源码

    在ASP.NET开发中,创建一个具有智能提示功能的搜索输入框是提高用户体验的重要方式,它可以让用户更快地找到他们想要的信息。本示例提供了一种简单实现这一功能的方法,通过结合控件和数据库链接,模拟百度或Google...

    仿百度搜索输入框提示JS代码(PHP+MySql数据库版

    在构建一个类似百度搜索输入框的提示功能时,我们需要结合前端JavaScript技术和后端PHP以及MySQL数据库来实现。这个功能的核心是提供实时的搜索建议,当用户在搜索框中输入文字时,系统会从数据库中查询匹配的数据并...

    chosen能搜索的输入框

    Chosen的核心特性是其内置的搜索功能,允许用户在输入框中输入关键字,快速过滤出相关的选项。 **Chosen的主要特点:** 1. **直观的搜索体验**:Chosen的搜索功能使得用户可以在下拉选项中快速找到目标,极大地...

    textbox输入框自动提示功能

    在IT领域,"textbox输入框自动提示功能"是一种常见的用户界面设计,特别是在搜索引擎或各种表单应用中。这种功能能够显著提升用户体验,因为它允许用户快速找到并选择他们想要输入的信息,而无需完整地键入整个词句...

    Android代码-Material风格的搜索输入框

    MaterialDialogSearchView MaterialDialogSearchView is a custom implementation of a Toolbar SearchView in a material design. It is an alternate approach using Material dialogs as SearchView similar to ...

    ajax输入框提示集合

    标题中的“ajax输入框提示集合”指的是利用Ajax技术实现的一种搜索框功能,它可以为用户在输入时提供实时的搜索建议或匹配结果。 描述中提到的“在淘宝上买的,自己搜集和自己用的,打包下载”,这可能是指一个包含...

    jsp+ajax实现输入框自动搜索

    jsp+ajax实现输入框自动搜索 本文将详细介绍如何使用jsp和ajax技术实现输入框自动搜索功能,类似于百度搜索。 一、标题:jsp+ajax实现输入框自动搜索 该标题表明该技术使用jsp和ajax实现输入框自动搜索功能。 二...

    axure 不同搜索项输入框中的提示消失与显示

    在设计用户界面时,搜索项输入框是一个重要的元素,它为用户提供了一个方便的途径来查找所需信息。本文将深入探讨如何在Axure中处理不同搜索项输入框中的提示文字,使其在用户操作时正确地消失和显示。 首先,我们...

    仿百度输入框仿百度输入框

    通常,一个搜索输入框由`&lt;form&gt;`元素包裹,包含一个`&lt;input&gt;`元素用于用户输入,可能还会有一个`&lt;button&gt;`元素作为提交按钮。例如: ```html 请输入关键词"&gt; 搜索 ``` 接着是CSS(Cascading Style Sheets),...

    android通讯录搜索,通过输入框搜索以及侧边litview的滚动搜索,还有单选,全选以及反选的功

    本文将深入探讨如何构建一个功能完善的通讯录搜索系统,包括输入框实时搜索、侧边ListView滚动搜索、以及单选、全选和反选功能。 一、输入框搜索 输入框搜索(也称为实时搜索或类型ahead搜索)是用户在输入框中...

Global site tag (gtag.js) - Google Analytics