jquery - jQuery Chosen 插件：自定义/格式化选择中的选项文本

Question

我在 jquery 中使用了一个名为 selected 的插件，用于具有自动完成功能的选择框。http://harvesthq.github.com/chosen/

我在哪里可以格式化选择框中选项的文本？

选择的插件中有一个方法吗？我已经阅读了文档并扫描了代码，但似乎找不到它。

这是我想要实现的屏幕截图。（这是用另一个插件'selectmenu'制作的，但我想用'chosen'做同样的事情）

Answer 1

目前 master 分支没有这样的功能。

但是有这个拉取请求，这就是你所需要的（目前它仅适用于 jquery）： https ://github.com/harvesthq/chosen/pull/692

所以你可以从这里获取代码。 https://github.com/cjstewart88/chosen/tree/templates

Answer 2

这是现在的另一种方法......

您可以添加在正常选择中看起来还不错但通常不会出现在文本中的特殊字符。例如TITLE :: Description. 然后 :: 使用它找到 and 格式。此示例专为单选而设计。对于多个，您可能只需要更改.chosen-single, 或使用其他方式来选择它。

$('select[name="SELECT_NAME"]')
    .chosen({search_contains: true})
    .add('.chosen-search')
    .on('chosen:showing_dropdown keyup change', function() {
    $('.chosen-results .active-result, .chosen-single span').html(function() {
        var html = $(this).html();
        if (/ :: /.test(html)) {
            return '<strong>' + html.replace(' :: ', '</strong> <span style="font-size:70%;display:inline;font-weight: normal;">') + '</span>';
        } else {
            return html;
        }
    });
});

你在这个例子中的结果应该是<strong>Title</strong> <span style="font-size:70%;display:inline;font-weight: normal;">Description</span>

Answer 3

您可以将宽度作为参数添加到选择

$("field").chosen({ width: '400px' })