selectboxes 用の jquery プラグインである select2 を使用しています - http://ivaynberg.github.io/select2/
これについての 1 つの良い点は、複数の選択を行う方法ですが、問題が発生しています。
問題 1 - ドロップダウン ボックスをクリックすると、プレースホルダー テキストが消えます。これはリストが表示されるので問題ありませんが、リストをクリックすると、もう一度クリックするまでプレースホルダーが再表示されません。
問題 2 - 実際に 2 つまたは 3 つの選択を行い、最後の選択を削除したときにこれらを再度削除すると、プレースホルダー テキストが戻る前にボックスをクリックする必要があります。
余分なクリックなしで最後の要素が削除されるとすぐにテキストが戻ってくるのは本当に何ですか
ここhttp://ivaynberg.github.io/select2/と Programmatic Access セクションに移動し、2 番目のドロップダウンを使用すると、問題が表示されます。
ここにjsフィドルがあります
http://jsfiddle.net/dwhitmarsh/MfJ4B/13/
ここに私のコードがあります
$(function() {
$(".select2").select2({
formatSelection: multipleFormatResult,
dropdownCssClass : 'bigdrop',
escapeMarkup: function (m) { return m; }
}).on("change", function(e) {
//add tooltip when option selected
var title = $(this).attr("data-placeholder");
var data=$(this).select2("data");
if ( checkObject(data) !== true) {
$(this).parent().addClass("activeLI");
} else {
$(this).parent().removeClass("activeLI");
}
});
});
var hasOwnProperty = Object.prototype.hasOwnProperty;
function checkObject(obj) {
// null and undefined are empty
if (obj == null) return true;
// Assume if it has a length property with a non-zero value
// that that property is correct.
if (obj.length && obj.length > 0) return false;
if (obj.length === 0) return true;
for (var key in obj) {
if (hasOwnProperty.call(obj, key)) return false;
}
return true;
}
function multipleFormatResult(data, container) {
var markup = data.text;
return markup;
}