java文本框获得输入焦点_文本框获得焦点和失去焦点的判断代码

java文本框获得输入焦点_文本框获得焦点和失去焦点的判断代码文本框失去焦点事件、获得焦点事件onBlur:当失去输入焦点后产生该事件onFocus:当输入获得焦点后,产生该文件Onchange:当文字值改变时,产生该事件Onselect:当文字加亮后,产生该文件onpropertychange当属性改变发生该事件无论粘贴keyuponchange等,最为敏感先来看javascript的直接写在了input上jquery实现方法对于元素的焦点事件,我们…

大家好,又见面了,我是你们的朋友全栈君。

文本框失去焦点事件、获得焦点事件

onBlur:当失去输入焦点后产生该事件

onFocus:当输入获得焦点后,产生该文件

Onchange:当文字值改变时,产生该事件

Onselect:当文字加亮后,产生该文件

onpropertychange 当属性改变发生该事件

无论粘贴 keyup onchange等,最为敏感

先来看javascript的直接写在了input上

jquery实现方法

对于元素的焦点事件,我们可以使用jQuery的焦点函数focus(),blur()。

focus():得到焦点时使用,和javascript中的onfocus使用方法相同。

如:

$(“p”).focus(); 或$(“p”).focus(fn)

blur():失去焦点时使用,和onblur一样。

如:

$(“p”).blur(); 或$(“p”).blur(fn)

实例

搜神马?  这里label覆盖在文本框上,可以更好的控制样式

jquery代码

$(function() {

$(‘#searchKey’).focus(function() {

$(‘#lbSearch’).text(”);

});

$(‘#searchKey’).blur(function() {

var str = $(this).val();

str = $.trim(str);

if(str == ”)

$(‘#lbSearch’).text(‘搜神马?’);

});

})

好了相当的不错吧下面是一个简单的例子:

无标题文档

function tt(){

var i=document.form1.text1.value;

if(i.length>=6)

document.getElementById(“s1″).innerHTML=”用户名不能大于6位”;

else

document.getElementById(“s1″).innerHTML=””;

}

function a(){

var j=document.form1.text2.value;

if(j.length>=6)

document.getElementById(“s2″).innerHTML=”密码不能大于6位”

else

document.getElementById(“s2″).innerHTML=””;

}

用户名:

密码:

第一种: html5

html5给表单文本框新增加了几个属性,比如:email,tel,number,time,required,autofocus,placeholder等等,这些属性给表单效果带来了极大的效果变化。

其中placeholder就是其中一个,它可以同时完成文本框获得焦点和失去焦点。必须保证input的value值为空, placeholder的内容就是我们在页面上看到的内容。

代码如下:

第二种: jQuery

原理:让表单的val值等于其title值。

代码如下:

$(function() {

var $input = $(“input”);

$input.each(function() {

var $title = $(this).attr(“title”);

$(this).val($title);

$(this).focus(function() {

if($(this).val() === $title) {

$(this).val(”);

}

})

.blur(function() {

if($(this).val() === “”) {

$(this).val($title);

}

});

});

});

文本框获得焦点、失去焦点调用JavaScript

无标题页

function text1_onmouseover(it)

{

it.focus();

it.select();

it.style.backgroundColor=”red”;

}

function text1_onmouseout(it)

{

it.onblur;

it.style.backgroundColor=”white”;

}

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/148752.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • Linux true命令清空文件内容

    Linux true命令清空文件内容

  • C语言优先级 运算符

    C语言优先级 运算符1、最高级:出现同级别运算符时的结合方向是从左往右(下面级别没写结合顺序时,默认是从左往右)。()圆括号[]下标运算符号->指向结构体成员运算符.结构体成员运算符2、第二级:!、~、++、–、-、(类型)、*、&、sizeof。这一级都是单目运算符号,这一级的结合方向是从右向左。比如出现*p++,这时*和++同级别,先算右边,再左边。所以*p+…

  • macbook重设密码服务器错误_网页显示500错误

    macbook重设密码服务器错误_网页显示500错误在网上查了查解决方案如下:1。右键我的电脑–管理–本地用户和组,给IUSR_机器名和IWAM_机器名两个用户设置密码,要一样。2。开始–运行–打cmd,然后cdD:InetpubAdminscripts(我的系统在D盘),然后cscript.exeadsutil.vbssetw3svc/wamuserpass你的密码,然后cscript.exeadsutil.vbssetw…

  • 52.说一下 synchronized 底层实现原理?_synchronized底层实现

    52.说一下 synchronized 底层实现原理?_synchronized底层实现概述说起多线程同步,一般的方案就是加锁,而在java中,提到加锁就想起juc包提供的Lock接口实现类与默认的关键字synchronized。我们常听到,juc下的锁大多基于AQ

  • oracle触发器类型

    http://www.cnblogs.com/roucheng/p/3506033.html触发器是许多关系数据库系统都提供的一项技术。在ORACLE系统里,触发器类似过程和函数,都有声明,执行和异

    2021年12月23日
  • Java 的下载安装教程[通俗易懂]

    Java 的下载安装教程[通俗易懂]Java17的下载安装教程说明:本文介绍的是Windows下安装Java的方法。对于Linux下Java的安装,可见笔者的另一篇博客:在Linux操作系统中安装Java:https://blog.csdn.net/wangpaiblog/article/details/120093325笔者的安装环境:JDK17Windows10教育版安装Java就是安装JDK。Java有三大分支,这里选择的是JavaSE。关于

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号