select2.js - 如何對齊選項元素內的兩個項目

我想使用select2.js插件在<option>元素內部對齊兩個項目。select2.js - 如何對齊選項元素內的兩個項目

例如，在這裏：

<select id="myExample" class="pull-left"> 
    <option value="1" class="pull-left"><span class="pull-left">Item A </span><span class="pull-right">Company A</span></option> 
</select>

我想項目A在左邊和A公司對準右側對齊。

我該如何做到這一點？我只嘗試使用CSS，但它似乎並沒有工作。

jsFiddle

來源

2015-10-27 brunodd

使用你的字符串分隔符，在我的例子中，我用「〜」，然後拆分此選擇2逃過你的標記後：在您選擇

$("select").select2({ 
    escapeMarkup : function(text){ 
     text = text.split("~"); 
     return '<span class="pull-left">'+text[0]+'</span><span class="pull-right">'+text[1]+'</span>'; 
    } 
});

雖然，你應該使用類似的東西：

<select id="myExample" class="pull-left"> 
    <option value="1" class="pull-left"> 
     Item A~Company A 
    </option> 
</select>

這是一個工作小提琴：http://jsfiddle.net/wphqwvLf/55/

來源

2015-10-27 15:54:21 Burimi

Thanks @Burimi。有關如何顯示下拉列表的任何想法？看起來它正在被切斷。 – brunodd

我在這裏做了一個小小的調整[鏈接]（http://jsfiddle.net/pue3eba4/）增加一個
。 –

謝謝@DanEtchy當我使用搜索輸入時，如何擺脫「未定義」文本？ – brunodd

你實際上是自己編寫選項還是通過ajax獲取它們？因爲我認爲你自己寫的是這裏的問題。如果你通過ajax檢索數據，你可以使用格式化功能，它工作正常。例如：

function formatAdresses (email) { 
    var $email = $("<span>"email.NACHNAME + "</span><span class='pull-right'>" + email.EMAIL + "</span>"); 
    return $email; 
};

來源

2015-10-27 16:02:55 Danmoreng

我爲示例使用了靜態文本。 – brunodd

select2.js - 如何對齊選項元素內的兩個項目

回答

相關問題