input textbox tag
aaarticlea/png;base64,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" alt="" /> 1 <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>textTag</title>
<style>
.box{border:1px solid #ddd; overflow: hidden;padding-bottom:10px; cursor:pointer;}
.box .list{float:left;}
.box p{float:left; padding:5px; background-color:rgba(235, 140, 0, 0.46); border:1px solid #e7eceb; margin:9px 10px 0; position:relative; margin-left:10px;}
.box p a{ display:block; width:15px; height:15px; background:#eb8c00; font-size:8px; position:absolute; text-align:center; line-height:17px; color:#fff; text-decoration:none; border-radius:10px; right:-5px; top:-5px;}
.box input{float:left; height:30px; border:none;margin-left: 10px; margin-top:12px; border: none;outline:none}
.box div{float:right; margin-bottom:0px;}
.box .tip{border:1px solid #eb8c00 !important}
</style>
</head>
<body>
<div class="box" id="ccc"></div>
<input type="button" value="getValue" onclick="getValue()"> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.0.js"></script>
<script> (function () {
var tag = { init: function (cfg) {
this.obj = cfg.id;
this.reg = cfg.reg;
this.createElement();
},
createElement: function () {
var oInput = "<input type='text' class='edit' style='border:none' />";
if ($(this.obj).length == 0) throw new Error('元素不存在');
$(this.obj).append(oInput);
this.addEvent();
},
addEvent: function () {
var _this = this;
$(this.obj).click(function () {
$(this).find('input').focus().css('border', 'none');
})
$(document).delegate('.edit', 'keyup', function (event) {
if (event.keyCode == 13 || event.keyCode == 32) {
var txt = $(this).val().trim();
if (_this.reg != '') {
var patt = new RegExp(_this.reg);
if (!patt.test(txt)) {
$(this).addClass("tip")
return;
}
}
$(this).removeClass("tip")
if (txt != '') {
_this.createTag($(this), txt)
}
$(this).val('');
}
})
$(document).delegate('.closed', 'click', function () {
$(this).parent().remove();
})
},
createTag: function (obj, txt) {
var oP = "<p><a class='closed' href='javascript:;''>x</a><span>" + txt + "</span></p>";
obj.before(oP);
},
getvalues: function () {
var list = $(this.obj).children("p").children('span');
var content = [];
for (var i = 0; i < list.length; i++) {
content.push(list[i].innerHTML);
}
return content.join(',')
},
setvalues: function (p) {
$(this.obj).find('p').remove();
if (p != null && p.trim() != '') {
var ps = p.split(',');
for (var i = 0; i < ps.length ; i++) {
this.createTag($(this.obj).find('input'), ps[i]);
}
}
}
}
window.textTag = tag;
})(window); textTag.init({
id:"#ccc",
reg:/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/
}) function getValue(){
alert(textTag.getvalues());
} </script>
</body>
</html>
input textbox tag的更多相关文章
- DER input, Integer tag error的异常处理
1.首先我向大家介绍一下我做的东西,发生这个异常的情况. 我做的是一个电签的系统,在调用某公司的API生成证书,然后与安证通进行同步证书的任务. 2.问题具体的异常 具体异常如下: 2016/08/2 ...
- 支付宝APP支付开发- IOException : DER input, Integer tag error
支付宝APP支付Java开发报错: 1 java.security.spec.InvalidKeySpecException: java.security.InvalidKeyException: I ...
- CVS 文件自动移 tag 的 Python 脚本
CVS 文件自动移 tag 的 Python 脚本 背景 工作中使用的版本管理工具是 CVS,在两次发布中,如果修改的文件比较少,会选择用移 Tag 的方式来生成一个新 Tag 发布.文件比较少的情况 ...
- WPF用样式实现TextBox的虚拟提示效果
[版权声明]本文为博主原创,未经允许禁止用作商业用途,如有转载请注明出处. 话说好多软件和网站都能实现虚拟提示,好吧这个名词是我自己起的,因为我也不知道这么形容这个效果. 效果描述:在TextBox没 ...
- Python+Selenium 利用ID，XPath，tag name，link text，partial link text，class name，css，name定位元素
使用firefox浏览器,查看页面元素,我们以“百度网页”为示例 一.ID定位元素 利用find_element_by_id()方法来定位网页元素对象 ①.定位百度首页,输入框的元素 ②.编写示 ...
- 转:[web]javascript 增加表單的input
利用javascript增加form的input 這是js的部份 //用來區分不同input的name var element_count = 0; function add_element(obj) ...
- Python+Selenium练习篇之3-利用tag name定位元素
前一篇文章介绍了如何通过元素的id值来定位web元素,本文介绍如何通过tag name来定位元素.个人认为,通过tag name来定位还是有很大缺陷,定位不够精确.主要是tag name有很多重复的, ...
- Professional C# 6 and .NET Core 1.0 - Chapter 41 ASP.NET MVC
What's In This Chapter? Features of ASP.NET MVC 6 Routing Creating Controllers Creating Views Valida ...
- C# 6 与 .NET Core 1.0 高级编程 - 41 ASP.NET MVC（中）
译文,个人原创,转载请注明出处(C# 6 与 .NET Core 1.0 高级编程 - 41 ASP.NET MVC(中)),不对的地方欢迎指出与交流. 章节出自<Professional C# ...
随机推荐
- c# 判断两个集合是否有交集
/// <summary> /// 判断是否有交集 /// </summary> /// <typeparam name="T"></ty ...
- 关键字的使用 pass break continue
# ### 关键字的使用 # (1)pass 过 作用 作站位用的 if 5==5: pass i = 0 while i <5: pass #约定俗成,在循环里面什么也不行的情况下,给友好提示 ...
- linux kvm虚拟机安装
1.上传ISO文件,这里采用OEL5.8x64iso 2.开始安装OEL5.8 (1)raw格式磁盘 virt- --vcpus= --disk path=/data/test02.img,size= ...
- 集合的addAll方法--list.addAll(null)会报错--java.lang.NullPointerException
Exception in thread "main" java.lang.NullPointerException at java.util.ArrayList.addAll(Ar ...
- 洛谷P3616 富金森林公园
题目描述 博艾的富金森林公园里有一个长长的富金山脉,山脉是由一块块巨石并列构成的,编号从1到N.每一个巨石有一个海拔高度.而这个山脉又在一个盆地中,盆地里可能会积水,积水也有一个海拔高度,所有严格低于 ...
- 用最短的payload绕过WAF（入门）
本文作者:jishuzhain <font color=green>想绕过一个WAF,我们可以用最短的payload来做,这里只是基础示例,望各位大佬勿喷,小弟在此谢过.</font ...
- 性能测试—认识JMeter（一）
性能测试—认识JMeter(一) <零成本web性能测试>第二章 JMeter基础知识总结和自己的理解 一.JMeter百度词条概念 Apache JMeter是Apache组织开发的基 ...
- win10安装express遇到的问题。
昨天在centos上成功安装了express,今天想在win10上面装一个,死活安装不了 express可以正常安装,但是每次安装express-generator的时候一直报错 659 silly ...
- centos7 systemd 必知必会
systemd 简介: systemd 是一个 Linux 系统基础组件的集合, 提供了一个系统和服务管理器, 运行为 PID 1 并负责启动其它程序 功能包括: 1.支持并行化任务 2.同时采用 s ...
- 关于DES加密内部收费版
数据加密算法(Data Encryption Algorithm,DEA)是一种对称加密算法,很可能是使用最广泛的密钥系统,特别是在保护金融数据的安全中,最初开发的DEA是嵌入硬件中的.通常,自动取款 ...