对输入框焦点/模糊的jquery奇怪的行为

我是jQuery的新手，同时使用jQuery css属性我发现输入框焦点/模糊的奇怪行为。对输入框焦点/模糊的jquery奇怪的行为

我的代码是这样

<body> 

    Enter something <input type="text" id="text" /> 

<script> 
    $(document).ready(function(){ 

    $("#text").focus(function(){ 
       $("#text").css("border","5px"); 
      }); 

      $("#text").blur(function(){ 
       $("#text").css("border-color","#555"); 
      }); 

    }); 

    </script> 
</body>

它去最坏的模糊，为整个输入框得到了从那里消失。我尝试了解jQuery API文档和一些其他来源，但没有找到任何结果。如果我做错了，请让我知道，谢谢你提前。

来源

2013-04-10 Praveen Dabral

此工程 - - Fiddle

$(document).ready(function() { 

    $("#text").focus(function() { 
     $("#text").css("border", "5px solid black"); 
    }); 

    $("#text").blur(function() { 
     $("#text").css("border", "1px solid red"); 
    }); 

});

来源

2013-04-10 18:45:08

感谢您的回答，但我想知道为什么我的代码没有运行？有没有任何错误或什么。 – 2013-04-10 18:50:49

这是所有关于'边框样式'它应该是点缀，双重，坚实，虚线，但不应该没有 – 2013-04-10 18:55:59

好吧，得到它谢谢你。我试着给它$（“＃text”）。css（“border”，“5px”，“solid”，“＃333”）; – 2013-04-10 19:01:27

$("#text").focus(function(){ 
    $("#text").css("border","5px solid"); 
           ^should be set 
});

这里是jsiddle

来源

2013-04-10 18:46:16 mehdi

谢谢你明白了。 – 2013-04-10 19:03:02

Fiddle - 您对焦点事件应该只是指定你想要改变的属性。

$("#text").css("border-width","5px");

这实际上是一个CSS问题，而不是jQuery。由于您只是指定了border（这是一个css速记属性）并且只给了它一个参数，所以您覆盖了使用css构建的浏览器。

来源

2013-04-10 18:52:29 Bryce

谢谢，我试过了，但是像这样$（“＃text”）.css（“border”，“5px”，“solid”，“＃333”）; – 2013-04-10 19:04:11

对输入框焦点/模糊的jquery奇怪的行为

回答

相关问题