如何在 jquery 中更改 keyup 上输入文本的边框颜色？答案

【问题标题】：How to change border color of an input text on keyup in jquery?如何在 jquery 中更改 keyup 上输入文本的边框颜色？
【发布时间】：2014-07-26 04:05:35
【问题描述】：

我有一个类似的 html 代码，如下所示：

<form>
     <input type='text' id='inputVal'>
</form>

还有这个 jquery 代码：

maxVal = 100;
$('#inputVal').keyup(function(){
   var $this = $(this);
   var insertedVal = $this.val();
   if (insertedVal > maxVal){
      $this.css({"color":"red","boder":"1px solid red"});
   }
})

如果我输入一个大于 100 的数字，字体颜色会变为红色，就像预期的那样。但是，边框颜色保持不变。为什么？如何修改我的代码以使边框颜色也变为红色。

【问题讨论】：

从正确的引用和拼写开始
您在#inputVal 之后错过了一个单引号，并且您尝试修改的css 属性是“bo r der”，而不是“boder”。另外，如果你只想改变颜色，“border-color”就足够了。
好的，我纠正了错别字
而且，我的代码中也有相同的错字“boder”。这解决了我的问题。

标签： javascript jquery html css

【解决方案1】：

您的“边界”拼写错误：

$this.css({"color":"red","border":"1px solid red"});

而且（我假设这是将代码粘贴到 SO）您忘记了选择器周围的结束引号。

【讨论】：

我的代码中没有出现引用错误（它不是粘贴的）。函数的中间部分被粘贴了，是的，我有一个字体错字。谢谢

【解决方案2】：

// Shorthand for $( document ).ready()
$(function() {
   maxVal = 100;
   $('#inputVal').keyup(function(){
      var $this = $(this);
      var insertedVal = $this.val();
      if (insertedVal > maxVal){
         $this.css({"color":"red","border":"1px solid red"});
      }
   })
});

应更正引号和拼写

【讨论】：

别玩聪明，我想每个人都知道，如果我说 jquery 之前有代码。就像您可以在我的 html 代码中添加和标签一样。普通，别搞笑了
怎么了？刚刚用 jsfiddle 测试了它并粘贴了一个副本。我想惹恼任何人。对不起