input textbox tag
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAb8AAAB0CAIAAACaKavmAAAJ0klEQVR4nO3dO2wb5wHA8YOHIkOLrkUmXYEC3dihKEwU7NCppIcsWjh1KAK2MGkJyKCBUyejsh5xC4hBWxSII8mKB3Vk28iK5BgtYlhGJVFvUaIeieNKtgzogTiSrA7Hu/vu48ej+B1pPvL/4QPCO96Dlui/7kE5xgUAoHpGo18AALQk6gkAOqgnAOigngCgg3oCgA65nnkAwCUo6nl2dnYOAPClqOf5+XkdD3YBoC1QTwDQQT0BQAf1BAAd1BMAdFDPZnH65X+OJrsPRq7uv//W/vtvHYxcPZrs/qbwSaNfFwA16tl4Zy9Wjqbe2//j9/b6DGnsD37n8H7ydG+u0a8RgIx6Ntjrbw5f/O3Hpd0Ux/M/d7z++qDRrxSAB/VssKOp9/zTaY3DT37X6FcKwEOnnk/39xg1GV8t/eMy6bTGq81s3d4GAKqmWc/jmdvHjwcZAcfLe7+8fD0PJ67X7W0AoGq69Xw8ePKolxFwvPjrjy5fz4OPflq3twGAqlHPhtbzLz/0JvLmqfNVfnZTvv9++7u1//4D0EU9G1pPxbHnzdOLi/P1dxTHnnd+Ure3AYCqUc9Gjpdjvyit56tnT84vnpwobrv/tm5vAwBVo56NHIf/etebyHdeHV2cfm6dv8sBfbX29zq9CQBooJ4NHi9Hf36pG+7//M3F67O6vQ0AVI16Nngc//v3+3/6foXfNcr84Pxkr27vAQA63mA9MxHD6Bgal+ZYvPMVo2coZBjxRJnNiiLZRgex2nE02f1yNLzXf6XcUefp08/r9gYAoOkN1TOX7pArOd4ZLpYukTTKlLE4EkkrjNIy453hS84svoCSRgvlDad7fNKsfram4zD764Phnz3/4O29/it7/Veef/D2wcjVr57cqdu3HkAgDTv2zMb9iymNkmPPTMTnMDOX7khmvOuWHuGOd4btDVpx9yayuJawnTc9jh8PPt3nhB1oUi1az0TSk85i6cLpnpNHPUOhSPZRz1C8MyduYbwz7K1nNi0uIG3f2mCDLwLUqp6GIX+XAQRXu3pap8yGkcx4ypWN25cjnXraSxrC+XhxsVBnLhNxD/fsJcPphFi3bFzsYCJpHzbmMhH3tD3TKR9p+l5dFWuuPs1XDPuSgvcQ1b5MUXqlwkhmvBcxnC+F6gcJ9QSaWc3q6RQtGzeMULGeQpKs0JQ59nROou3ESL0rFsfZlHSQ6ExmIoaw+pB40l2hnomk+6x1HbbTPt8vd9EzkbT3JdZW/HNl4/YfWb7A2jMUMoxQR9j6Qokvm3oCLaJW9ewZCjl//+1jT++lSemAzlPPTMQJ7knx2LNnKCRmS7izJB6ceq8G5NId7h6rqmcm4u5rvDNsGOFQRAx3adpy6Q73NTsllfcivGzxB4P3Z4wYYuoJtIqaHXs6p6tOBbx98b/uaZ8Clw2Ke4yZS0fsjci3krxFvvyZeyJZ/nWW+0iA+rptyaeysnH7+in1BNpLTe8aOVfxQp05ORCV7xrZV0idg7hK9ZSW8UxWvmskbNl7d0hZQDmU6s+fll4wdb8I1BNoL7U7c3dq5bk9IqTEp57CybidFemIT6iVc1Dp2aD3Lrl4Ju5bT+8NKLdlwurSNQQxlGJ2E8l4onjWLyzs/jGpJ9Beannd066GcwcmkXRPxqUPXVq3TdxrnU6JcukO+xhTuODo3HWJJ9wLmkKPsvGOZNy+UCBeRfUeF0uFysa9c+yIe7pf7oOl0sfy7XXdO0VSsivVszTQ1BNoZrU89szalz6lOzDFaKbVn1gKp3tOMpFkxvn0j5sq51y+eAe8mKqeoXRCWkD4JJBwyzst3Pp3OBsJGTKhucKnjqQbX/K1Ammn3t25x8LOrGRG3HUkK2xECij1BJpZa/4rIeJt9zLD++tGLTmoJ9DMWrOepSfdJel8A7+ZTj2Bb7NWreeJ+GEgcWQipafALTqoJ9DMWrieJ496xd+VLL3+2OqDegLNrNXr2c6DegLNjHo276CeQDOjns07qCfQzKhn8w7+dWSgmVHP5h3UE2hmuvWcuX38eJBR3zFzm3oCTUuznow3Nur2rQcQiE49AQDUEwB0UE8A0EE9AUAH9QQAHdQTAHRQTwDQQT0BQAf1BAAd1BMAdFBPANBBPQFAB/UEAB3UEwB0KOp5dnZ2DgDwpagnAKAiuZ7d3yZ1PKYH0O4U9dzZ2fmy3e3s7FBPAEEo6rm7u/u/dre7u0s9AQShPvZ81u449gQQEPUEAB2Kem5tbT1td1tbW9QTQBCKehYKhUbf1Km7QqFAPQEEoajn5ubmF7V1r9u8Nvjwi4eD10yz+17p8w8Hr5nXBh+WWdv/WT2bm5vUE0AQinpubGzs1tbH3WZs4LPd3d3PBmLFR9LTZvfHZddWrxTMxsYG9QQQhKKe+Xx+p6IHAzHT0jUwEDNjAw/k+fa8sS57RtfYzgNxWXcNe5awtumZaT0e6zLNrjHFeord+svn89QTQBCKeq6vr29XMNZlmrH+6e3t7e3p/phpT0z3x+zZ1jJdY/ZD1exte31rero/5j413R8r3apnXXd2ud36WF9fp54AglDUc21tbcvf3S4z1j8tTFmT3tnCtOeJ6f6Y2XVXvSlBMYmeR3e7THdVZ3bZ3fpYW1ujngCCUNRzdXW14GuqL2reGPVMRvumClN9UVMW7ZsqFAqjN4oPLMKk9Exxlndte/vWU86OK+/Wx+rqKvUEEISinisrK5u+Pu2LmjdGPZPRvk+d/5YaveF9wt6AtKFiN61F3a25j6x6Xnq3PlZWVqgngCAU9VxeXt7wN5Iyo7cmhSlrciRlmqmRistvbGxM3oqaqRFptndy8la0OOk+8uzAmV12tz6Wl5epJ4AgFPVcWlqq9O/aDadMM9p7P5/P5+/3Rk174n5v1DRTw8JC1sRwyl7aswVhWe/y9tPuVku3P5yquFsfS0tL1BNAEOp6rlc00WtfbUz19kbN1HBxvpW94jP2zHU7hhPeDbgLyCtHeyesQk9YS9qrCrsdHk65W1TvtjzqCSAgRT0XFxfXqjHxh1+ZyY+qWqXhFhcXqSeAIBT1XFhYWPV3J2mayTuqiVaxsLBAPQEEoahnLpdbqeTD6+6Z8vUPKy7edHK5HPUEEISinvPz88vtbn5+nnoCCEJRz7m5uaV2Nzc3Rz0BBKGo5+zs7GK7m52dpZ4AglDUc2Zm5r/tbmZmhnoCCIL/nzsA6JDrCQC4DOoJADqoJwDooJ4AoIN6AoAO6gkAOqgnAOigngCgg3oCgA7qCQA6qCcA6KCeAKCDegKADuoJADqoJwDooJ4AoIN6AoAO6gkAOqgnAOigngCgg3oCgA7qCQA6qCcA6KCeAKCDegKADuoJADr+D8FaMrbKBHhMAAAAAElFTkSuQmCC" 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# ...
随机推荐
- IE 直接打印 页面的方式
1. 通过在IE中加载adobe pdf reader 插件 进行直接打印和打印的配置(推荐) <body> <object id="pdf1" width= ...
- 模块sys, os, glob, pickle, subprocess常见用法
参考python常用标准库 http://blog.51cto.com/lizhenliang/1872538 一. sys 1. sys.argv 脚本名1.py, 命令行中执行python 1 ...
- executeQueryForObject returned too many results.
//错误位置: 这个错误出现在持久层与数据库交互时,原因是 queryForObject这个方法封装唯一值,但是给出的sql语句返回了多个值 public int getListCount(SqlMa ...
- UIButton的探秘
原文链接 sizeToFit()和sizeThatFits(_:) sizeToFit()会调用sizeThatFits(_:)方法,将现在的frame作为参数.然后根据函数返回的结果更新view. ...
- iOS 之NSOperation（一）
一.NSOperation的介绍 1.NSOperation的作用 配合使用NSOperation和NSOperationQueue实现多线程编程 2.实现多线程的具体步骤 1)将需要执行的操作封装到 ...
- Selenium使用parameterized库进行参数化
在我们做自动化测试的时候参数化是必不可少的,那么要怎么去做参数化呢?咱们来看下unittest+parameterized是怎么实现的 1.https://github.com/wolever/par ...
- 【UVA11324】 The Largest Clique （Tarjan+topsort/记忆化搜索）
UVA11324 The Largest Clique 题目描述 给你一张有向图 \(G\),求一个结点数最大的结点集,使得该结点集中的任意两个结点 \(u\) 和 \(v\) 满足:要么 \(u\) ...
- Bootrap 项目实战（微金所前端首页）第三部分（CSS,js源码）
CSS源码 common.css /** *Created by xxc on 2019/2/26 */ body, html, div, img, a, p, ul, ol, dl, dd, dt, ...
- python 控制台输出带颜色的文字的方法
python_控制台输出带颜色的文字方法 在python开发的过程中,经常会遇到需要打印各种信息.海量的信息堆砌在控制台中,就会导致信息都混在一起,降低了重要信息的可读性.这时候,如果能给重要的信 ...
- python super()继承和多继承
class A: def __init__(self): self.n = 2 def add(self, m): print('self is {} @A.add'.format(self)) se ...