焦点和模糊的jquery背景颜色变化

我有以下问题:我有一个带有三个文本输入字段的表单,我想在其中一个字段具有焦点时更改背景颜色,并在失去焦点时将其设置回。 我想出了以下代码:

HTML(简化):

jQuery的

 $(document).ready(function() { $('input:text').focus( function(){ $(this).css({'background-color' : '#FFFFEEE'}); }); $('input:text').blur( function(){ $(this).css({'background-color' : '#DFD8D1'}); }); }); 

谢谢

#FFFFEEE不是正确的颜色代码。 请尝试使用#FFFFEE

您尝试做的事情可以简化为此。

 $('input:text').bind('focus blur', function() { $(this).toggleClass('red'); }); 
 input{ background:#FFFFEE; } .red{ background-color:red; } 
  

更简单,只需CSS就可以解决问题:

 input[type="text"], input[type="password"], textarea, select { width: 200px; border: 1px solid; border-color: #C0C0C0 #E4E4E4 #E4E4E4 #C0C0C0; background: #FFF; padding: 8px 5px; font: 16px Arial, Tahoma, Helvetica, sans-serif; -moz-box-shadow: 0 0 5px #C0C0C0; -moz-border-radius: 5px; -webkit-box-shadow: 0 0 5px #C0C0C0; -webkit-border-radius: 5px; box-shadow: 0 0 5px #C0C0C0; border-radius: 5px; } input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus { border-color: #B6D5F7 #B6D5F7 #B6D5F7 #B6D5F7; outline: none; -moz-box-shadow: 0 0 10px #B6D5F7; -webkit-box-shadow: 0 0 10px #B6D5F7; box-shadow: 0 0 10px #B6D5F7; } 

经测试的代码:

 $("input").css("background","red"); 

完成:

 $('input:text').focus(function () { $(this).css({ 'background': 'Black' }); }); $('input:text').blur(function () { $(this).css({ 'background': 'red' }); }); 

测试版本:

jQuery的1.9.1.js
jQuery的UI,1.10.3.js

在代码中应该有昏迷“,”而不是冒号“:”

代码必须是$(this).css({'background-color' , '#FFFFEE'});

我希望它有所帮助。

对Saleha来说