如何按显示顺序获取jQuery Chosen的值?

时间:2012-09-17 02:34:45

标签: jquery jquery-chosen

我正在使用“选择”插件使选择看起来更好,我的问题是,如何在显示时按顺序获取所选项目值,表单提交和val()都为您提供值按照它如何被列出的顺序。

http://harvesthq.github.com/chosen/

<!DOCTYPE html>
<html><head><title></title>
<link rel="stylesheet" type="text/css" href="chosen.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="chosen.jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#CheckValue').click(function() {
        alert($('#test').val());
    });
    $('#test').chosen();
});
</script></head><body>
<?PHP if(isset($_REQUEST['test'])) var_dump($_REQUEST['test']); ?>
<form method='post'>
<select id='test' name='test[]' multiple style='width:200px;'>
    <option value=1>1</option>
    <option value=2>2</option>
    <option value=3>3</option>
    <option value=4>4</option>
    <option value=5>5</option>
</select><br />
<input type=button id='CheckValue' value='CheckValue' />
<input type=submit value='Submit' />
</form></body></html>

2 个答案:

答案 0 :(得分:3)

enter image description here

只要看一下图片就会看到一个id为selTJI_chzn的div,里面会显示一些li元素。你可以像上面那样做

$(function(){
    var ret = [];
    $('#selTJI_chzn').find('.search-choice').each(function(){
      var selectedValue = $(this).find('span').text();
      ret.push(selectedValue);  
    })
    console.log(ret);
})

答案 1 :(得分:2)

老问题我知道......但是我遇到了同样的问题,并且遇到了这个小插件,允许简单获取/选择多项选择:https://github.com/tristanjahier/chosen-order