jQuery選擇插件：自定義/格式選擇文本

Question

我在jquery中使用一個名爲選擇框的自動完成功能插件。 http://harvesthq.github.com/chosen/

在哪裏可以在選擇框中格式化選項的文本？

在選定的插件中是否有這種方法？我已閱讀文檔並掃描了代碼，但似乎無法找到它。

這是我想要實現的屏幕截圖。 （這是由另一個插件「selectmenu」，但我希望做同樣的用「選取」）

Answer 1

有一個在主分支在當前時間沒有這樣的功能。

但有這個拉的要求，立即至極是你所需要的（目前它僅僅是jQuery的）： https://github.com/harvesthq/chosen/pull/692

所以，你可以從這裏獲取代碼。 https://github.com/cjstewart88/chosen/tree/templates

Answer 2

您可以添加寬度作爲參數來選擇

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

Answer 3

這裏是另一種方式來做到這一點現在...

您可以添加特殊字符仍然看行不行的正常選擇，但通常不會出現在文本中。例如TITLE :: Description。然後找到::並使用它的格式。這個例子是爲單選而設計的。對於多個，您可能只需更改.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>