使用javascript覆盖CSS参数值

Overwriting the CSS parameters value using javascript

本文关键字:参数 CSS 覆盖 javascript 使用      更新时间:2023-09-26

我想在出现错误时将输入文本框的颜色更改为红色。我给的代码有一个css样式表,它只是改变所有的文本框的颜色为红色,如果我想使用该样式表。有没有一种方法可以将文本框边框颜色设置为红色。(这里我不关心我将如何寻找错误,只是想知道设置任何单个文本框的颜色为红色所需的属性类型)

下面是文本输入 的代码
 <input name="count" 
 type="number" 
 walked="true" 
 autocomplete="off" 
 class="htmlplusinput numberinput novalue" 
 style="width: 24px; " 
 id="htmlplusinputnumberinput19" 
 hasobj="true" 
 novaluedisplay="number">

这里我也想避免使用id来访问这个文本框,因为id是动态改变的。(我的意思是说id htmlplusinputnumberinput19将是其他时间htmlplusinputnumberinput789)因此,如果我可以使用其他参数,这将是一个更好的解决方案。

下面是CSS样式工作表,它应用于页面

上的所有输入文本框
 input[type="text"], .htmlplusinput {
  border: 1px solid gray;
  }

为您提供关于如何选择输入元素而不是通过其id的建议,您需要提供有关页面标记的更多信息。它可以像这样工作:

$('#example-form input[name=count]')

如果你使用jQuery,设置css属性值很容易:

$('input[name=count]').css('border-color', 'red');

也可以为元素添加一个错误类:

$('input[name=count]').addClass('error');

@Judy我认为最好的方法是您的验证代码指出问题元素的ID。所以你可以使用一些像这样的jQuery $('#myElementId').css('border-color', 'red');

我会在错误输入中添加一个类。

CSS:

input.error { color: red; };

Javascript(在验证点上):

currentValidatingInput.className += " error";