表单获取焦点失去焦点

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>请输入关键词</title>
<script type="text/javascript" src="js/jquery.min.js"></script>
<style>
.wait{color: green}
</style>
</head>
<body>
<input type="text" class="ipt">
<script type="text/javascript">
$(function(){
$(".ipt").val("请输入关键词").addClass("wait")
.blur(function(){
if($(this).val()==""){
$(".ipt").val("请输入关键词").addClass("wait");
}
})
.focus(function(){
if($(".ipt").val()=="请输入关键词"){
$(".ipt").val("").removeClass("wait");
}
})
})
</script>
</body>
</html>

时间: 2024-09-30 23:32:47

表单获取焦点失去焦点的相关文章

点击enter回车键实现表单元素切换焦点效果

点击enter回车键实现表单元素切换焦点效果:现在网站都比较追求人性化,比如填写表单的时候,能够实现点击回车就可以切换表单元素的焦点,这样比使用鼠标进行切换更能让人接受,下面就通过代码实例介绍一下如何实现此功能.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://w

第27天:表单获取焦点和数组声明遍历

一.表单 1.this指事件的调用者2.input.value 表单更换内容3.innerHTML更换盒子里的内容,文字.标签都能换.4.isNaN("12")如果里面的不是个数字,返回true 二.表单自动获得焦点txt.focus();//方法Onfocus事件 三.鼠标经过选择表单select();选择txt.onmouseover=function(){this.select();}四.获取某类元素getElementById();//获取一个标签元素getElementsBy

jQuery学习笔记(5)--表单域获得焦点和失去焦点样式变化

1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head runat="server"> 3 <title></title> 4 <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 5 <style ty

JavaScript网站设计实践(七)编写最后一个页面 改进表单

原文:JavaScript网站设计实践(七)编写最后一个页面 改进表单 一.最后一个页面 contact.html.改进表单 在该页面实现的功能: 几乎所有的网站都会有表单填写,对于用户输入和填写的数据,首先我们一般现在前台验证,然后再去后台验证. 在前台最简单的验证:检查必填字段是否填写.填写格式是否符合要求等. 每个表单里面,当获取到输入焦点时,令提示文本消失 现在开始动手来写. 1.实现思路 (1)在这个表单里会验证的是必填字段和邮箱格式是否正确.首先,把判断必填字段和邮箱格式分别写在两个

jquery.validation.js 表单验证

jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 一导入js库 <script src="../js/jquery.js" type="text/javascript"></script> <script src="../js/jq

表单新特性

1 placeholder 文本站位 当用户还没有输入值时,输入型控件可能通过placeholder向用户显示描述性说明文字或者提示信息,这在目前网站中很常见,一些JS框架都会提供类似功能,简单的说下在旧版本中常用的解决方案,为输入控件创建一个label,然后通过CSS控制些label的位置使之覆盖在输入控件上面,当label获得焦点时,浏览器会把焦点指向输入控件.有了placeholder,新的浏览器就内置了这一功能,其特性值会以浅灰色样式显示在输入框中,当输入框获得焦点并有值后,该提示信息自

表单验证——jquery validate使用说明

//validate 选项*********************************************************** $("form").validate({ debug:true //进行调试模式(表单不提交) rules:{ name:"required", //自定义规则,key:value的形式,key是要验证的元素,value可以是字符串或对象 email:{ //内置验证方式 required:true, //必填项 requ

Jquery.validate.js表单验证插件的使用

作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例讲解应用.it's perfect. 首先记录一些使用过程中,爱犯的错误: 1>忘记给表单form添加id属性 2>input这些表单标签必须id属性和name属性名字一样.例如:<input type="text" id="name" name=&q

封装表单自定义错误信息。(阻止默认错误信息提示,添加自定义错误信息提示)

1 前台提交信息到后台,两种表单验证: 2 1,form 表单验证 3 2,ajax 无刷新页面提交 4 5 表单验证方法一般有: 6 1,浏览器端验证 7 2,服务器端验证 8 3,ajax验证 9 4,浏览器和服务器双重验证 10 11 html5表单新增类型: 12 email,url,number,range,data(date,month,week,time,datetime,datetime-local),search,color,tel等 13 ======== 14 重点:pat