摘要
最近一直在折腾邮件的h5应用,为了保证在pc,ios,android端都可以使用,所以使用H5页面的方式嵌入app的webview中。
页面
UI大概是这样的
首先引入js和css
输入框
rush:js;">
上面的输入框,有默认的value,你可以直接调用tagsInput方法,使其变为tags
rush:js;">
$('#tags').tagsinput();
rush:js;">
$('#tags').tagsInput({
autocomplete_url:'http://myserver.com/api/autocomplete'
});
你可以通过addTag和removeTag方法添加和删除标签
rush:js;">
$('#tags').addTag('foo');
$('#tags').removeTag('bar');
rush:js;">
$('#tags').importTags('foo,bar,baz');
可以判断是否已经存在某个tag
rush:js;">
if ($('#tags').tagExist('foo')) { ... }
如果你希望在添加或者删除后,有其他的操作,该插件也提供了添加和删除的回调函数。
rush:js;">
//$("#tags").tagsInput({
// //'autocomplete_url': url_to_autocomplete_api,// //'autocomplete': { option: value,option: value },// 'height': '100px',// 'width': '300px',// 'interactive': true,// 'defaultText': 'add a tag',// 'onAddTag': function (tag) {
// console.log('添加了',tag);
// },// 'onRemoveTag': function (tag) {
// console.log('移除了',// 'onChange': function (tag) {
// console.log('变化了',// 'delimiter': [',',';'],// Or a string with a single delimiter. Ex: ';'
// 'removeWithBackspace': true,// 'minChars': 0,// 'maxChars': 0,// if not provided there is no limit
// 'placeholderColor': '#666666'
//});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。