在用户登陆的界面中，一般都需要用户名和密码才能登陆，这时为了增强用户体验，最好能在当前输入框没有获取焦点时，提示输入信息， 获取焦点之后，提示信息消失 ，文本框显示的信息为用户输入的信息；同时在用户没有输入信息的情况下，或者 鼠标移开的情况下，提示信息重新出现 。

这时，用户名和密码区设置获取焦点和失去焦点这个小的功能就显得非常重要了。因为jQuery 封装了很多 javascript 的函数，所以使用起来非常方便快捷，同时，代码简洁明了。这里，我们采用 jQuery 实现 这个功能。

Html 部分代码如下：

Index.html

<form action="" method="post">

<h2> 用户登陆 </h2>

<span> 用户名 </span><input type="text" value=" 请输 入你的用户名 " name="username" id="username">

<span> 密 码 </span><input  type="password" value="" name="password"  id="password">

<button type="submit" id="login"> 登陆 </button>

</form>

jQuery 实现部分代码：

// 获取用户名

// 获取焦点

$("#username").focus(function(){

// 获取当前文本框的值

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

if(curValue==this.defaultValue){

$(this).val("");

// 失去焦点

$("#username").blur(function(){

var curValue=$("#username").val();

if($.trim(curValue)==""){

$(this).val(this.defaultValue);

浏览器效果如下：

// focus是要添加的样式类 $(".login-form").on("focus", "input", function(){ $(this).closest('.item').addClass('focus'); }).on("blur","input",function(){ $(this).closest('.item').removeClass('focus'); //初始化选中用户名 输入框 $("#itemBox").fin 在前端开发中，有时我们为了客户更好的体验，需要使用js处理一些css解决不了的问题 比如，当文本框的文字多余文本框的时候，有一部分文字没有出来的时候，我们点击文本框，让 焦点 出现在最后面，这样子可以提高用户的体验 这里举个例子来说明一下 比如这种情况 当点击文本框的时候，在文本框的 焦点 出现在最后下面用代码来举例//html结构 <input type="text" v 先来看javascript的直接写在了input上 jquery 实现 方法对于元素的 焦点 事件，我们可以使用 jQuery 的 焦点 函数focus(),blur()。focus()：得到 焦点 时使用，和javascript中的onfocus使用方法相同。如：$("p").focus(); 或$("p").focus(fn)blur()： 失去 焦点 时使用，和onblur一样。如：$("p").blur(); 或$(... jquery 判断input 输入框 的值，用到input事件，blur事件，focus事件需求：当 输入框 有字或者正在输入时，右边的圆形取消按钮才出现。否则不出现。 // 输入框 正在输入时 $("#ipt").on('input',function(){ if(!($('#ipt').val()=='')){ 使用 jQuery 检测HTML5的自动聚焦功能(Detect HTML5's autofocus feature with jQuery )每当文本字段集中在我的网站上时，我都会使用 jQuery 执行操作。 只要我通过点击它手动聚焦文本字段，一切正常。但是：我正在使用HTML5的自动聚焦功能，而 jQuery 没有检测到文本字段自动被聚焦。 如何手动或自动聚焦文本字段，如何确保我的脚本执行操作？现在，我正在... 一、 jQuery 中的focus() 获取 焦点 事件与blur() 失去 焦点 事件（鼠标事件）： 1. focus() 事件： 当元素获得 焦点 时，触发focus事件。可以通过鼠标点击或者键盘上的TAB导航触发。这将触发所有绑定的focus函数事件。 【 $(".wrap input").focus(function () { console.log(“input已经 获取 到了 焦点 ”); }); 】 2. blur() 事件： 当元素 失去 焦点 时触发 blur 事件。 这个函数会调用执行绑定到 jquery 判断对象具有 焦点 可以使用is()方法，is()方法用于查看选择的元素是否匹配选择器，结合css3的伪类选择器:focus即可判断，具体的代码是$(selector).is(':focus')，当返回结果为true，则具有 焦点 。 jquery 如何判断对象是否 获取 焦点 ？ jquery 判断对象 获取 焦点 可以使用$(selector).is(":focus")。当对象具有 焦点 时返回为true，否则返...