如何从文本字段

Question

我有这样

'&lt input id="yourinput" type="text" &gt' 

一旦用户在HTML表单中的文本框添加删除边界进入它的文字和移出我想使边框为1个像素（这样看起来不像普通的文本字段）。我通过

$("#searchforstatus").css("border", "1px"); 

现在做到这一点，当用户回来到文本字段，我想使文本字段的样子与它的退出值原本正常的看文本字段。

Answer 1

假设你想要的input只神态各异当它包含一个值，我建议这样的：

$(document).ready(
    function(){ 
     $('#textInput').blur(
      function(){ 
       if ($(this).val()) { 
        $(this).addClass('bordered'); 
       } 
      }); 
     $('#textInput').focus(
      function(){ 
       $(this).removeClass('bordered'); 
      }); 
    }); 

而且在定义bordered CSS类CSS文件（而不是增加/ jQuery中与css()除去CSS属性），例如：

.bordered { 
    border: 1px solid #f00; 
} 

Demo at JS Fiddle。

Answer 2

// Add border when user enters text field 
$("#yourinput").focus(function() { 
    $(this).css("border", "1px"); 
}); 

// Remove border when user leaves text field 
$("#yourinput").blur(function() { 
    $(this).css("border", "0"); 
}); 

Answer 3

做严格的CSS，不使用JavaScript的，那是像用锤子的主食..

<style> 
#searchforstatus{ 
border:none; 
} 


#searchforstatus:focus{ 
border:1px solid silver; 
} 

</style> 

OR。创建带有border：none和border的类; 1px并随意分配/取消分配。

Answer 4

这应该工作：

$("#searchforstatus").css("border", ""); 

它看起来像$("#searchforstatus").css("border", null)之前1.4.3工作，但它不是以往任何时候都实际上是有效的：http://bugs.jquery.com/ticket/7233

Answer 5

$("#yourinput").focus(function() { 
    $(this).css("border", ""); 
} 

$("yourinput").blur(function() { 
    if($(this).val() != "") 
      $(this).css("border", "1px"); 
} 

Answer 6

我认为最好的和简单的解决方案是：

$("#searchforstatus").css("border", "none"); 

Answer 7

如果您使用jQuery Mobile的，如果你测试它的移动，你需要在你的CSS文件中添加以下代码

textarea:focus, input:focus{ 
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);  
    -webkit-user-modify: read-write-plaintext-only; 
} 

它正在为我工​​作