在selectize api下拉列表中获取当前选择索引

Question

我一直在使用Selectize API并努力确定如何获取当前所选项目的索引/位置。

我查看了API，发现getValue（）获取所选项的值，但我需要索引。我还调查了.selectize选项本身，但似乎找不到存储它的任何属性？

Answer 1

使用API​​，您可以使用：

var selectize = $('#ddowhat').selectize()[0].selectize;

var val = selectize.getValue();
var tag = selectize.getItem(selectize.getValue());
var text = tag.text();

如果您有多个选项，则标记将是一个数组。

Answer 2

我的搜索结果有点不同 - 搜索后没有找到答案。

我使用jQuery来获取页面上的所有选择。然后我通过每个循环（所以我可以单独更改每个项目的css值）。

1. var htmlSelects = $（'select'）;
2. htmlSelects.each（function（i）{....}
3. 我选择了对象的父级，然后我选择了它： var parentDIV = $（this）.closest（'div'）。prop（'id'）;
4. 然后我“选择”选择对象（捕获原始的z-index，这样我可以在下拉列表中更改它并在关闭时恢复） var $ select = _input.selectize（{     选项：[{create：true，                sortField：'text'     }]，     onDropdownOpen：function（）{     var cssZIndex = $（'＃'+ parentDIV）.css（'zIndex'）;         $（'＃'+ parentDIV）.attr（'cssZIndex'，cssZIndex）;         $（'＃'+ parentDIV）.css（'zIndex'，'1000'）;     }，     onDropdownClose：function（）{         $（ '＃' + parentDIV）的CSS（ 'zIndex的'，$（ '＃' + parentDIV）.attr（ 'cssZIndex'））;     } }）;
5. 我使用了“partial class match”和parentDIV来获取选择的下拉对象： var elem = $（“[class ^ ='selectize-dropdown']”，“＃”+ parentDIV）[0];

6. 我为selectized选择创建了一个click事件动作，它允许我获取对象的textContent属性（它包含所选择的所有“选项”（由换行符分隔） $（elem）.on（'click'，'。selectize-dropdown-content div'，function（）{

   //GET THE textContent OPTION LIST VALUE,
   //REPLACE THE NEWLINES OR RETURNS WITH A PIPE
   var optionString = $(elem)[0].textContent.replace(/[\n\r]/g, '|');
   
   //CREATE AN ARRAY OF OPTIONS VALUES
   var optionArray = optionString.split('|');
   
   //GET THE TEXT VALUE OF THE OPTION CLICKED ON 
   //( AGAIN REPLACE THE NEWLINES OR RETURNS WITH AN EMPTY STRING
   var optionText = $(this).text().replace(/[\n\r]/g, '');
   
   //GET THE INDEX OF THE SELECTED OPTION TEXT VALUE 
   //IN THE OPTIONS LIST ARRAY
   var optionIndex = $.inArray(optionText, optionArray);
   })