http://jsfiddle.net/BbWza/1193/
$.widget("ui.combobox", {
_create: function () {
var self = this;
var select = this.element.hide(),
selected = select.children(":selected"),
value = selected.val() ? selected.text() : "";
var input = $("<input />")
.insertAfter(select)
.val(value)
.autocomplete({
delay: 0,
minLength: 0,
source: function (request, response) {
var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
response(select.children("option").map(function () {
var text = $(this).text();
if (this.value && (!request.term || matcher.test(text)))
return {
label: text.replace(
new RegExp(
"(?![^&;]+;)(?!<[^<>]*)(" +
$.ui.autocomplete.escapeRegex(request.term) +
")(?![^<>]*>)(?![^&;]+;)", "gi"),
"<strong>$1</strong>"),
value: text,
option: this
};
}));
},
select: function (event, ui) {
ui.item.option.selected = true;
self._trigger("selected", event, {
item: ui.item.option
});
var event;
if (document.createEvent) {
event = document.createEvent("HTMLEvents");
event.initEvent("combochange", true, true);
} else {
event = document.createEventObject();
event.eventType = "combochange";
}
event.eventName = "combochange";
if (document.createEvent) {
self.element[0].dispatchEvent(event);
} else {
self.element[0].fireEvent("on" + event.eventType, event);
}
},
change: function (event, ui) {
if (!ui.item) {
var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"),
valid = false;
select.children("option").each(function () {
if (this.value.match(matcher)) {
this.selected = valid = true;
return false;
}
});
if (!valid) {
// remove invalid value, as it didn't match anything
$(this).val("");
select.val("");
input.data("autocomplete").term = "";
return false;
}
}
},
})
.addClass("ui-widget ui-widget-content ui-corner-left");
input.data("autocomplete")._renderItem = function (ul, item) {
return $("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
};
$("<span> </span>").attr("tabIndex", -1).attr("title", "Show All Items").insertAfter(input).button({
icons: {
primary: "ui-icon-triangle-1-s"
},
text: false
}).removeClass("ui-corner-all").addClass("ui-corner-right ui-button-icon").click(function () {
// close if already visible
if (input.autocomplete("widget").is(":visible")) {
input.autocomplete("close");
return;
}
$(this).blur();
// pass empty string as value to search for, displaying all results
input.autocomplete("search", "");
input.focus();
});
},
destroy: function () {
this.input.remove();
this.button.remove();
this.element.show();
$.Widget.prototype.destroy.call(this);
}
});
$('#combobox').combobox();
$('#clicky').click(function() {
$('#combobox').combobox('destroy');
});
如您所见，当您单击“销毁组合”按钮时，它不会销毁，我在做错什么吗？我确定您只需要将其命名为$（'＃combobox'）。combobox（'destroy'）; 我不确定是否有什么原因阻止了通话的进行。任何帮助将不胜感激！
您处在正确的路径上，只是没有正确调用特定的对象。
工作示例：http : //jsfiddle.net/Twisty/BbWza/1195/
destroy: function() {
console.log("Bye bye.");
this.element.next("input[role='textbox']").remove();
this.element.next("span[role='button']").remove();
this.element.show();
$.Widget.prototype.destroy.call(this);
}
当您调用destroy时，this.element是原始select元素。因此，我们期待创建的下一个项目，然后将其删除。
希望能有所帮助。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句