Question

我通过在函数顶部添加contenteditable="true"，在div $.fn.val = $.fn.html;上运行了jQuery UI自动完成功能。但是，使用input时，div元素上正在处理的所有其他功能现已中断。设置最小字符数和允许多项选择等功能不再起作用。我收到了Can't find variable extractLast和TypeError: undefined is not an object (evaluating 'val.split')等错误消息。有没有办法让jQuery从我的text()中提取html()或div，而不是试图寻找input或textarea val() }？

$(function() {

    $.fn.val = $.fn.html;

    function split(val) {
        return val.split(/,\s*/);
    }

    function extractLast(term) {
        return split(term).pop();
    }

    $("#div")
        .autocomplete({
            delay: 0,
            highlightClass: "bold-text",
            autoFocus: true,
            search: function() {
                // custom minLength for multiple selections
                var term = extractLast(this.value);
                if (term.length < 3) {
                    $(this).autocomplete("close");
                    return false;
                }
            },
            source: function(request, response) {
                // delegate back to autocomplete, but extract the last term
                response($.ui.autocomplete.filter(
                    availableTags, extractLast(request.term)));
            },
            select: function(e, ui) {
                var terms = split(this.value);
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push(ui.item.value);
                // add placeholder to get the comma-and-space at the end
                terms.push("");
                this.value = terms.join(", ");
                return false;
            }
        });
});

Answer 1

使用javascript＆＃39; this.innerHTML代替this.value，但这也会检索标签。或者使用jQuery＆＃39; $(this).text()从[Object HTMLDivElement]中获取文本值。

jQuery UI自动完成功能满足于多个选择

1 个答案: