jQuery UI Autocomplete不遵循input maxlength属性，如何选中后截断内容？

可以借助Autocomplete的select事件实现选中后的字符串截断，具体操作如下：

• 绑定select事件，在回调里获取选中的选项文本
• 将文本截断至100字符长度
• 阻止组件默认的填充行为，手动把截断后的文本赋值给输入框

示例代码：

$("#your-input-id").autocomplete({
    source: ["示例建议文本", "超过100字符的长选项内容xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"],
    select: function(event, ui) {
        // 阻止默认填充动作
        event.preventDefault();
        // 截断文本到100字符
        var truncatedText = ui.item.label.substring(0, 100);
        // 给输入框设置处理后的文本
        $(this).val(truncatedText);
    }
});

如果你的Autocomplete是用value字段填充输入框，只需把代码里的ui.item.label替换成ui.item.value即可。另外记得保留输入框的maxlength="100"属性，确保手动输入时也能遵守长度限制。

内容的提问来源于stack exchange，提问作者Vee