jQuery.At

At.js 是一个自动完成库,用来实现自动完成提示,表情等。

你可以监听任何字符,而不仅仅是@符号,可为不同的字符设置多个监听器以实现不同的行为和数据。

监听器事件可以绑定到多个 Inputors(输入器) 。除了鼠标之外还支持键盘控制。您可以用一组可配置的回调来使用自定义数据处理程序和模板渲染。

引用JS文件

<link rel="stylesheet" href="/cdn/at/jquery.atwho.min.css">
<script src="/cdn/at/jquery.atwho.min.js"></script>
<script src="/cdn/at/jquery.caret.min.js"></script>

通过ID调用

$('#inputor').atwho({
    at: "@",
    data:['index', 'where', 'Anne']
})

当文本框中输入@号时,会被提示data设置的数据列表。

<span style="color:#FF0000;">注意:此时文本框中不能有内容,如果有的话输入@号就不会有提示,需要进行其他配置选项解决。</span>

其它配置参考如下:

$.fn.atwho[“default”] = {
    at: void 0,
    alias: void 0,
    data: null,
    displayTpl: “<li>${name}</li>”,
    insertTpl: “${atwho-at}${name}”,
    callbacks: DEFAULT_CALLBACKS,
    searchKey: “name”,
    suffix: “ “,
    hideWithoutSuffix: false,
    startWithSpace: true,
    highlightFirst: true,
    limit: 5,
    maxLen: 20,
    minLen: 0,
    displayTimeout: 300,
    delay: null,
    spaceSelectsMatch: false,
    tabSelectsMatch: true,
    editableAtwhoQueryAttrs: {},
    scrollDuration: 150,
    suspendOnComposing: true
};

<span style="color:#FF0000;">startWithSpace:</span>关键字符前是否为空,true: 文本框的内容为空,输入关键字符才有效。false:不管文本有无内容,只要输入关键字符就提示。

<span style="color:#FF0000;">suffix:</span>当选中data设置的数据后,文本框内容加的后缀字符。默认的为一个空格。设置“”为不用后缀。

<span style="color:#FF0000;">limit:</span>显示提示列表的数量。

赞(0) 打赏
取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

    暂无评论...