使用 textWildCardArea.js 插件向文本区域添加通配符

版本:

浏览量:986

最后更新：2021-09-06

应用标签：MAC 软件 git Jquery插件

推荐指数:

查看演示点击下载

详细信息

textWildCardArea.js 是一个 jQuery 插件，可以更轻松地从 textarea 元素添加或删除通配符（如标签）。

如何使用它：

1. 为您的 textarea 元素分配一个唯一 ID。

<textarea id="MyTextWildCardArea" class="example">
  ...
</textarea>

2. 创建要插入文本区域的标签列表。

data-target：目标文本区域的选择器
数据标签：任何标签

<ul data-toggle="tag" data-target="#MyTextWildCardArea">
  <li><a class="tag tag--available" data-tag="[ExampleTag]" role="button">[ExampleTag]</a></li>
  <li><a class="tag tag--available" data-tag="[Email]" role="button">[Email]</a></li>
</ul>

3. 下载插件，textWildCardArea.js加载最新的jQuery库后放置JavaScript 。

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/src/textWildCardArea.js"></script>

4.在textarea上初始化插件就完成了。

$(function(){
  $('.example').textWildCardArea();
});

5. 将您自己的样式应用于可用和不可用的标签。

.tag.tag--available {
  cursor: pointer;
  font-weight: 600;
}
 
.tag.tag--unavailable {
  cursor: pointer;
  font-weight: normal;
  font-style: italic;
  text-decoration: line-through !important;
}

联系我们