Question

我正在尝试使用以下插件实现克隆选择菜单：

但是我无法获得选择菜单的选项值。它改为返回选项文本。

如何使用jquery调用函数获取以下选择菜单onChange中选项的值（但不是文本）？

<script type="text/javascript">
jQuery(document).ready(function($){ 
   $(".selection").scrollectBox({
    preset: 'dropdown',
    numVisibleOptions: 4,
    scrollInterval: 150, 
    scrollOn: 'hover'
    });
});

    <select onchange="function(this);" id="selector" class="selection" >
    <option value="" selected="Select Topic">Select Topic</option> 
    <option value="Food">Food</option>
    <option value="Drink">Drink</option>
    </select>

感谢，

RE-编辑：

不起作用

<script type="text/javascript">
jQuery(document).ready(function($){ 
   var selectEvent = function($el){
someFunction($(this).val());
return false;
};
   $(".selection").scrollectBox({
    preset: 'dropdown',
    numVisibleOptions: 4,
    onSelectEvent: selectEvent,
    scrollInterval: 150, 
    scrollOn: 'hover'
    });
});
</script>

返回[object Object]

不起作用

    <script type="text/javascript">
jQuery(document).ready(function($){ 
    $(".selection").scrollectBox({
        preset: 'dropdown',
        numVisibleOptions: 4,
        scrollInterval: 150, 
        scrollOn: 'hover',
        onSelectEvent: function (item, event) {
           alert(item).val();
        }
    });
});
</script>

返回[object Object]

Answer 1

根据ScrollectBox的源代码，您必须使用onSelectEvent属性，如下所示：

jQuery(document).ready(function($){ 
    $(".selection").scrollectBox({
        preset: 'dropdown',
        numVisibleOptions: 4,
        scrollInterval: 150, 
        scrollOn: 'hover',
        onSelectEvent: function (item, event) {
           alert(item.val());
        }
    });
});

Answer 2

您可以通过以下方式参考所选选项：$("#selector option:selected")

$("#selector").change(function() {
   var selectedValue = $("#selector option:selected").val();
   alert('Selected value ' + selectedValue);
});

JS小提琴： http://jsfiddle.net/Y7byM/1/

修改：

您可以在评论中将#selector更改为.selector：

$(".selection").change(function() { var selectedValue = $(".selector option:selected").val(); alert('Selected value ' + selectedValue); });

Answer 3

试过这个？

$('#selector').change(function() {
           // assign the value to a variable, so you can test to see if it is working.
            var selectVal = $('#selector :selected').val();
            alert(selectVal);
        });

Answer 4

我的“select”是通过AJAX调用提供的，我无法让调用程序使用.change方法。

表（在进行AJAX调用之前未声明）是

<select id="provincePick">
<option value="0" >Choose a province:</option>
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
<option value="MB">Manitoba</option>
<option value="NB">New Brunswick</option>
<option value="NL">Newfoundland and Labrador</option>
<option value="NS">Nova Scotia</option>
<option value="ON">Ontario</option>
<option value="PE">Prince Edward Island</option>
<option value="QC">Quebec</option>
<option value="SK">Saskatchewan</option>
<option value="NT">Northwest Territories</option>
<option value="NU">Nunavut</option>
<option value="YT">Yukon</option>

我在调用程序中需要的jQuery代码是

    $("body").on("change", "#provincePick", function(e)
    {
        alert( this.value );
    });

现在警报有效。

如何使用jquery获取选择菜单onChange中的选项值？

4 个答案: