對輸入框焦點/模糊的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奇怪的行爲

回答

相關問題