如何使用jquery和javascript获取类属性值

I'm trying to get the class of the selected option and use that in a compare statement to find exactly which class it is. I kept getting an undefined value even though option tag has a class set to it. Can anyone help me figure out why I'm not getting a value back?

我正在尝试获取所选选项的类，并在compare语句中使用它来精确地找到它是哪个类。我不断地得到一个未定义的值，即使选项标签有一个类集。谁能帮我弄明白为什么我没有得到回报?

Here is the code i'm trying to use:

下面是我正在尝试使用的代码:

Html:

<select name="datagrid_filter" onchange="startFilter();">
    <option>All</option>
    <option disabled="true">Assignment:</option>
    <option disabled="true">Client:</option>
    <option disabled="true">Type:</option>
    <option class="type" value="Activity"> &nbsp Activity</option>
    <option class="type" value="Alert"> &nbsp Alert</option>
    <option class="type" value="Lead"> &nbsp Lead</option>
    <option class="type" value="Notification"> &nbsp Notification</option>
</select>

Javascript:

var cs1 = $("option:selected", this).attr("class");
if(cs1 == 'Type'){
    //do something
}

3 个解决方案

#1

You should change:

你应该改变:

onchange="startFilter();" to onchange="startFilter(this);"

onchange = " startFilter();“onchange =“startFilter(这);“

and in startFilter function:

而在startFilter功能:

function startFilter(ele){
    var cs1 = $("option:selected", ele).attr("class");
    if(cs1 == 'type'){
        //do something
    }
}

Note that, in context of startFilter function, this is window object.

注意，在startFilter函数的上下文中，这是窗口对象。

#2

Try not to have inline JavaScript

尽量不要使用内联JavaScript

Fiddle Demo

小提琴演示

JavaScript

   $(function()
    {
        var handleChange    =   function()
                                {
                                    var $this     = $(this);
                                    var $selected = $this.children(":selected");
                                    var isType    = $selected.hasClass('type');
                                    if(isType)
                                    {
                                        alert('Do Something');                        
                                    }
                                };
        var $datagridFilter =  $('[name=datagrid_filter]')

        $datagridFilter.change(handleChange);

    });

#3

Why don't you use hasClass jQuery API? It's very good in this case:

为什么不使用hasClass jQuery API呢?这个例子很好

if($("option:selected", this).hasClass('type')){
    //do something
}

And make sure this referes to a proper object (as @undefined mentioned)
Or use:

并确保该引用指向一个合适的对象(如@undefined提到的)或使用:

if($("option:selected", "select[name=datagrid_filter]").hasClass('type')){
        //do something
    }

Or:

或者:

if($("select[name=datagrid_filter] option:selected").hasClass('type')){
            //do something
 }

#1