JQuery操作select标签代码段

        我们经常遇到要操作DOM元素，例如<select>，在Asp.net中Dropdownlist原型就是select。下面几个常用的代码或许对您有帮助：

    //1.获取选中option值
    $('#selectList').val();

    //2.获取选中option的文本
    $('#selectList :selected').text();


    //3.获取多个选中option值、文本
    var foo = [];
    $('#multiple :selected').each(function(i, selected) {
        foo[i] = $(selected).text();
    });
    // to get the selected values, just use .val() - this returns a string or array
    foo = $('#multiple :selected').val();


    //4.使用选项option的条件表达式
    switch ($('#selectList :selected').text()) {
        case 'First Option':
            //do something
            break;
        case 'Something Else':
            // do something else

            break;
    }

    //5.删除某个value=2的option
    $("#selectList option[value='2']").remove();


    //6.从list A 移动option到 list B.
     // here we have 2 select lists and 2 buttons. If you click the “add” button,
    // we remove the selected option from select1 and add that same option to select2.
    // The “remove” button just does things the opposite way around.
    // Thanks to jQuery’s chaining capabilities, what was once a rather tricky undertaking with JS can now be done in 6 lines of code.
    $().ready(function() {
        $('#add').click(function() {
            return !$('#select1 option:selected').appendTo('#select2');
        });
        $('#remove').click(function() {
            return !$('#select2 option:selected').appendTo('#select1');
        });
    });

如果您不了解JQuery，可以先看它的文档。

希望这篇POST对您有帮助。

Author: Petter Liu  http://www.cnblogs.com/wintersun