javascript - jquery/javascript 读取选择框 css/class

Question

我继承了一些代码，这些代码根据已选择的选项设置选择框的 css。页面上有很多选择框，我的目标只是获得具有“失败”css 样式的选择框。

我认为我已经相对接近了，但我就是无法让它为我工作。相对接近意味着我可以在 JavaScript 警告框中显示 css 类，但是当我尝试在 if 语句中使用该文本值时，没有任何反应。该代码如下。

感谢收到的任何指示。

$("select").each(function () {
   alert(this.options.item(this.options.selectedIndex).className);
   if (this.options.item(this.options.selectedIndex).className == 'frm_ddl_notOk') {
      alert('bunter?');
   }
});

20 小时后编辑...

我是个傻子。我拼错了我要找的类(class)。应该是“form_ddl_notOk”。我花了多长时间才注意到，这显然令人沮丧。尤其是在我使用了一个提示框之后，我可以将类名剪切并粘贴回我的代码中(然后我没有这样做!)。

当我使用正确的类名时，我随问题发布的不完美代码起作用了。

以下是我的问题的一些背景以及对其他问题和评论的回答:

当我在“failure”中找到一个元素时，我会寻找一个名为“comments”的同级元素，并强制填写“comments”。我无法根据选项文本进行选择我必须基于类和/或 bgcolor。样式应用于 select 元素和 option 元素。我使用更通用的选择器只是为了尝试弄明白。

感谢您的回复。不确定我是否应该将其中任何一个标记为“答案”。如果这个 Q 被删除，宇宙可能会继续正常运行。

Answer 1

而不是选择所有 <select>元素，改变你的选择器:

$("select.frm_ddl_notOk").each(function () {

});

这使用class 选择器(.)- http://api.jquery.com/class-selector/ .它只会返回具有特定类的元素。所以在你的情况下，它将寻找所有 <select>元素，然后根据它们是否具有类“frm_ddl_notOk”来过滤它们。

但更具可读性的是:

$("select").filter(".frm_ddl_notOk").each(function () {

});

如果您的目标是 <select> 就可以了具有特定类的元素(这就是您的问题似乎要解释的内容)。但是在您的代码中，您似乎正在查看 <option>元素(特别是选定的元素)以查看它们是否具有类(使用 jQuery 的 hasClass - http://api.jquery.com/hasClass/ )。如果是这样，你可以尝试这样的事情:

$("select").each(function () {
    var $this = $(this);
    if ($this.find("option").filter(":selected").hasClass('frm_ddl_notOk')) {
        alert('bunter?');
    }
});

这将找到选中的 <option> 每个的元素<select>元素，如果它有你正在查看的类，它会发出警报。

使用 :selected选择器 - http://api.jquery.com/selected-selector/

所以我想我的意思是如果你想得到选择的选项，使用:

$("select").find("option").filter(":selected")

如果你想设置选择的选项，使用:

$("select").find("option").eq(YOUR INDEX).prop("selected", true);

http://api.jquery.com/eq/

http://api.jquery.com/prop/

最后，如果您不需要对特定的 <select> 进行操作元素，只需使用这个:

$("select").find("option").filter(":selected").filter(".frm_ddl_notOk").each(function () {
    // The <option>s that have the "frm_ddl_notOk" class
});

在这一个中，它找到所有 <select>元素，看看他们的<option> children ，只看选择的，并且只看类“frm_ddl_notOk”。