jQuery不会检测何时选择了一个选项

时间:2011-08-26 01:19:11

标签: jquery select

我正在尝试使用jQuery操作选择列表,但它不会检测何时选择了一个选项。

我的选择列表:

<select id="SelThreeSEL" class="selectListComponent" component="selectListComponent"  multiple="true" size="5">
<option value="1"> Random Value 1 </option>
<option value="2"> Random Value 2 </option>
</select>

我正在使用一个简单的更改功能来验证它是否在选中时检测到一个选项,它甚至不会显示警告。

测试代码:

// Getting values when item is selected
$("#SelThreeSEL").change(function() {
alert($(this).val());
alert($(this).children("option:selected").text());
});

尝试使用:

操纵列表(向上/向下移动项目)
function moveUpItem(){
$('#SelThreeSEL option:selected').each(function(){
$(this).insertBefore($(this).prev());
});

我得到$('#SelThreeSEL选项:选中')为空。

问题可能是我的选择显示5个项目吗?

我已经验证了jQuery可以在页面上使用简单的$('div')。click()函数。

提前致谢。

2 个答案:

答案 0 :(得分:0)

更改您的moveUpItem()函数,如下所示:

    function moveUpItem(){
       $('#SelThreeSEL').find("option:selected").each(function(){
       $(this).insertBefore($(this).prev());
    });

答案 1 :(得分:0)

试试此代码:http://jsfiddle.net/qLMyk/

HTML:

<select id="selList" multiple="true" size="4">
    <option>Option 1</option>
    <option>Option 2</option>
    <option>Option 3</option>
    <option>Option 4</option>
    <option>Option 5</option>
    <option>Option 6</option>
    <option>Option 7</option>
</select>
<button id="moveUp">Move Up</button>
<button id="moveDown">Move Down</button>

JS:

$('#selList').change(function(){
    alert($(this).val());
});

$('#moveUp').click(function(){
    $('#selList option:selected')
        .each(function(i, item)
        {
            var $item = $(item);
            $item.prev().before($item);
        }); 
});

$('#moveDown').click(function(){
    $('#selList option:selected')
        .each(function(i, item)
        {
            var $item = $(item);
            $item.next().after($item);
        }); 
});