at.js使用

最新推荐文章于 2025-12-02 20:53:40 发布
原创 最新推荐文章于 2025-12-02 20:53:40 发布 · 305 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍如何利用At.js库实现文本编辑器中用户提及(@)的功能。通过加载jQuery.atwho.js脚本及对应的样式表，设置textarea元素具备@提及功能，包括指定触发字符、数据源接口与限制显示建议数量。
部署运行你感兴趣的模型镜像
‘
<script src="__PUBLIC__/client/code/jquery.atwho.js" type="text/javascript"></script>
<link href="__CSS__/jquery.atwho.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
$(function(){
    $('textarea').atwho({ at:"@", data: '/index.php/Weibo/Home/getAtAttention', limit: 6 });
});
</script>
’
文档地址
http://coffeedoc.info/github/ichord/At.js/rewrite/README.md.html

您可能感兴趣的与本文相关的镜像

LobeChat

LobeChat

AI应用

LobeChat 是一个开源、高性能的聊天机器人框架。支持语音合成、多模态和可扩展插件系统。支持一键式免费部署私人ChatGPT/LLM 网络应用程序。

仿新浪微博@功能 JS的实现 ——使用JQ At.js 和HTML5 contentEditable
李二狗的博客
05-25 7937
项目需求 增加@功能 先上效果图Atwho.js  gitHub地址   https://github.com/ichord/At.js需要引入的JS：  &lt;script type="text/javascript" src="jquery.caret.js"&gt;&lt;/script&gt;    // 这个JS插件用来获取光标位置  &lt;script type="text/jav...
vue-at：Vue的At.js
02-06
视点 实时演示和文档： : Docs由。 Chrome / Firefox / Edge / IE9〜IE11 基于纯文本，没有jQuery，没有额外的节点 内容可编辑/文本区域 头像，自定义模板 Vue2 / Vue1 Vuetify / Element-UI Vue-CLI 3迁移 另请参阅： 动机 很棒，但是： 它基于jQuery和jQuery-Caret。 它引入了额外的节点包装器。 在内容编辑/复制/粘贴时可能不稳定。 最后，我最终创建了这个。 npm i vue-at@2.x # for Vue2 <---- npm i vue-at@1.x
At.js – 用于 Web 应用程序的自动完成库
weixin_33854644的博客
05-01 222
　　At.js 是一个自动完成库，用来实现自动完成提示，表情等，就像你在 Github 或 Twitter 上看到的一样。它支持 HTML5 contentEditable 元素。你可以听任何字符，而不仅仅是 '@' 符号，可为不同的字符设置多个监听器以实现不同的行为和数据。 　　监听器事件可以绑定到多个 Inputors（输入器） 。除了鼠标之外还支持键盘控制。您可以用一组可配置的回调来使用自...
At.js 开源项目使用教程
gitblog_01092的博客
08-13 379
At.js 开源项目使用教程 1. 项目的目录结构及介绍 At.js 项目的目录结构如下： At.js/ ├── dist/ │ ├── at.js │ └── at.min.js ├── src/ │ ├── at.coffee │ └── ... ├── examples/ │ ├── basic.html │ └── ... ├── Gruntfile.coffee ...
At.js的使用
bajiudongfeng的专栏
08-26 1931
At.js实现在文本框中的搜索功能 使用jian
对于基于jq的插件at.js的一点点心得
Ezicat的博客
05-27 439
该插件的自动补全功能对于在评论区需要@某人时基本够用 在需求中需要在自动补全时输入中文名和用户ID两种方式进行搜索 由于翻了一些文档和博客没找到在搜索条件中如何添加两种以上搜索条件 英文文档：https://www.wenjiangs.com/doc/base-usage 所以自己捣鼓了一个笨方法： ​ //后端返回的整个@数组列表 var AllList = [{"name":"熊大","id":"xiongda","fullName":"熊大xiongda"},
react-at:At.js for React
05-14
React 筛选/滚动/插入/删除 键盘/鼠标事件 ...import At from 'react-at' const members = [ 'Roxie Miles' , 'grace.carroll' , '小浩' ] < At xss=removed> < / At> < At xss=removed> < / At >
at.min_js_at_neckl5y_
10-04
"at.min.js" 文件名暗示这可能是一个经过压缩和优化的JavaScript库或框架，用于提高网页加载速度和性能。"at"可能是库或框架的缩写，"min"表示这是最小化版本，意味着代码已经过混淆和压缩，以减少文件大小，加快...
jQuery使用At.js插件实现模仿新浪微博@功能特效源码.zip
11-19
在本项目中，我们主要探讨如何使用jQuery与At.js插件来实现类似新浪微博中的“@”功能，这是一种常见的社交网络交互方式，允许用户在文本中提及其他用户，从而触发通知。接下来，我们将深入讨论jQuery的基本概念，At...
uniapp editor富文本 quill.min.js image-resize.min.js
08-18
总的来说，"uniapp editor富文本 quill.min.js image-resize.min.js"涉及到的知识点主要包括uniapp框架的使用、Quill富文本编辑器的集成与定制、JavaScript图像处理以及富文本数据的管理和交互。这些技术的结合，...
At.js 开源项目教程
gitblog_00843的博客
08-13 951
At.js 开源项目教程 1. 项目介绍 At.js 是一个灵感来源于 Github 的自动补全库。它为富文本编辑器（ContentEditable）提供了类似 @ 引用的功能，支持用户在输入时实时搜索并插入内容。通过这个库，你可以轻松地在你的Web应用中实现类似Twitter或GitHub的提及（@mentions）和标签（#hashtags）功能。 2. 项目快速启动 安装 首先，你需要通过n...
at功能实现
xyr05288的专栏
03-02 2767
实现思路： 在可进行@的textarea中输入时，捕捉鼠标按起和键盘按起事件，获取光标位置，若光标前有@且没有空格则将at对象列表框显示出来，选择对象后，将【@前字符串】+【@对象】+ “ ”+【光标后字符串】重新连接起来即为新的textarea内容。其中at对象列表框的位置，是通过在页面中添加一个和textarea同内容但是不可见的div元素实现的。在@对象时，div的内容为【textarea中
jquery.atwho.js
weixin_34293902的博客
11-14 1030
2019独角兽企业重金招聘Python工程师标准>>> ...
利用at.js实现微博@功能
浮华饰浮华的博客
11-22 1535
直接贴出前端代码和@的交互逻辑代码 at.js官网 将页面内需要引用的js和css文件从官网下载,然后引入,直接打开这个demo就可以了 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="s...
At.js实现的输入框参数提示
09-18 6055
At.js(https://github.com/ichord/At.js)是GitHub上的一个开源项目，MIT授权，主要用来实现类似于微博人人输入@后显示候选好友列表的功能，具体效果可参见官方Demo: http://ichord.github.io/At.js/ 。本文基于版本v0.4.0。     官网上有example.html，但略显复杂，其实At.js的基本使用相当简单，除了作为基
推荐开源项目：Vue-AT - 基于Vue.js的高效拖拽与排序库
最新发布
gitblog_00070的博客
12-02 499
是一个轻量级且强大的 Vue.js 插件，专为实现拖放（Drag & Drop）和列表排序功能而设计。由开发者[fritx](https://link.gitcode.com/i/77a344f924623f96acee717c92918fa6)创建并维护，它提供了简单易用的API，帮助开发者快速在Vue应用中实现复杂的数据交互体验。 ## 技术分析 ### 核心特性 1. **兼容性广**
Vue.js的安装
sinat_38648282的博客
01-11 298
Vue.js的安装 Vue.js 是一套构建用户界面的渐进式框架，易用、灵活、高效。 一. Vue.js的兼容性 Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的浏览器。 二. Vue.js的安装 npm安装 在用 Vue 构建大型应用时使用 NPM 安装较好。 npm是nodejs的包管...
【亲测免费】 Vue-At 使用教程
gitblog_01184的博客
11-12 778
Vue-At 是一个用于 Vue.js 的 @ 提及插件，支持内容可编辑（contenteditable）和文本区域（textarea）。它允许用户在输入时通过 @ 符号提及成员，并提供自定义模板和列表的功能。Vue-At 支持 Vue 1.x、2.x 和 3.x 版本。 ## 2、项目快速启动 ### 安装 ```bash npm install vue-at ``` ### 基本使用
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值