使用选择性从选定内容中获取文本

Question

我试过这个:

var eventHandler = function() {
    return function() {
        console.log($select.val());
    };
};
var $select = $('.selectize').selectize({
    create          : true,
    onChange        : eventHandler()

});

这让我了解所选选项的价值,但我需要文本.当我这样做:

console.log($select.val().text());

我收到一个错误.我尝试过其他事情无济于事.如何获取所选文本？

Answer 1

select_option.getItem(select_option.getValue())[0].innerHTML; select_option = $select_option[0].selectize; 获取指定下拉选项的文本值.

this.getItem(value)[0].innerHTML 获取当前下拉选项的文本值

Answer 2

最简单的方法是使用onChange事件并从选定的选项中获取文本

JS：

$(function(){
$('#select').selectize({
					create: true,
					sortField: {
						field: 'text',
						direction: 'asc'
					},
					onChange:function(value){
					 $(".log").append("Value:" + value + "<br />");
      $(".log").append("Text:" +$("#select option:selected").text() + "<br />");
					},
					dropdownParent: 'body'
				});
});

<link rel="stylesheet" type="text/css" href="https://selectize.github.io/selectize.js/css/styles.css">
<link rel="stylesheet" type="text/css" href="https://selectize.github.io/selectize.js/css/selectize.default.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="https://selectize.github.io/selectize.js/js/selectize.js"></script>


<select id="select" class="control-form" data-placeholder="Select a person...">
<option value="">None</option>
<option value="4">Thomas Edison</option>
<option value="1">Nikola</option>
<option value="3">Nikola Tesla</option>
<option value="5">Arnold Schwarzenegger</option>
</select>
<div class="log"></div>

在这里演示

Answer 3

您可以通过以下方式获取选定的文本：

$('select').selectize({
         onInitialize: function (selectize) {
            selectize.on('change', function (value) {
                 var item = this.$input[0];
                 var selected_text = $(item.selectize.getItem(value)[0]).text();
              });
        }
 }

Answer 4

所以我让它工作了。这真是太糟糕了，必须有更好的方法。有一个方法getValue()，但没有相应的getText()方法。

var eventHandler = function() {
    return function() {
        var something = selectizeControl.getItem(selectizeControl.getValue());
        console.log(something.text());
    };
};

var $select = $('.selectize').selectize({
    create          : true,
    onChange        : eventHandler()

});
var selectizeControl = $select[0].selectize