动态获取姓名，弹出花名册

1.基于jQuery和layer，实现弹出动态获取的人员名称，选择并添加至输入框，第二次显示输入框中已有的人员名称且不能够再次选择之前已经选择的值。

$(function() {$.fn.extend({personlayer: function() {$(this).on("focus", function() {var a = this;$("body").after('<div id="addPerson" style="display: none;">' + '<table class="table table-bordered" id="addTable">' + "</table></div>");$.ajax({url: "这里是url",type: "post",dataType: "json",success: function(f) {var i = [];for (key in f.data) { i.push(f.data[key].name) } $("#addTable tr").remove();td = document.querySelectorAll("td");if (i.length > td.length) { var b = Math.ceil((i.length - td.length) / 5); for (var e = 0; e < b; e++) { $("#addTable").append("<tr><td></td><td></td><td></td><td></td><td></td></tr>") } } else { $("#addTable tr").remove(); for (var e = 0; e < i.length; e++) { $("#addTable").append("<tr><td></td><td></td><td></td><td></td><td></td></tr>") } } $("#addTable td").on("click", function() {$(this).toggleClass("in");$(".in").css({ "background": "rgba(255, 151, 25, 0.8)" })});var g;var k = document.querySelectorAll("td");var m = a.value,c = m.toString(),j = c.split(";");var h = [];for (var d = 0; d < j.length; d++) { h.push(j[d]) } setTimeout(function() {for (var n = 0; n < i.length; n++) { k[n].innerText = i[n] }for (var n = 0; n < k.length; n++) {for (var l = 0; l < h.length; l++) {if (h[l] == k[n].innerText) {k[n].style.backgroundColor = "#eee";k[n].style.pointerEvents = "none";k[n].classList.remove("in")}}}}, 100)},error: function() { alert(data.msg) }});layer.open({ title: "人员名册", type: 1, area: ["400px", "400px"], content: $("#addPerson"), fix: false, btn: ["确定", "取消"], yes: function(b) { ins = document.querySelectorAll(".in"); for (var c = 0; c < ins.length; c++) { a.value += ins[c].innerText + ";" } layer.close(b) }, cancel: function() { return true }, btn2: function(b) { return true } })})}});$(".allowperson").personlayer()
});

动态获取姓名，弹出花名册相关推荐

wpf 代码获取contextmenu_[C#] 转：在WPF里面获取右键弹出菜单（ContextMenu）的鼠标点击源（Owner）控件...
WPF的ContextMenu没有类似WinForm里面ContextMenu.SourceControl的概念,但是你可以通过ContextMenuService的GetPlacementTarge ...
Selenium-针对alert弹窗无法获取，弹出no such alert的解决方法
在爬取网页的过程中,经常会遇到一些弹窗的情况,有alert.confirm.prompt等三种,区别如下: alert() 弹出个提示框 (确定) 警告消息框 alert 方法有一个参数,即希望对用户 ...
flutter 弹出框键盘遮挡获取键盘高度
键盘高度:MediaQuery.of(context).viewInsets.bottom (此高度只能在键盘唤醒时在build中获取,弹出键盘会执行build) 看代码: iimport 'pack ...
asp.net中关于点击页面一个控件，弹出框的制作
先简述一下一下背景,最近有个项目中有一个页面是关于工作人员大致情况的展示页面,展示的信息放在一个gridview控件里面,控件里有一列为工作人员姓名,然后希望能达到点击姓名弹出一个框显示出此工作人员的 ...
modal vue 关闭_Vue弹出框的优雅实践
引言页面引用弹出框组件是经常碰见的需求,如果强行将弹出框组件放入到页面中,虽然功能上奏效但没有实现组件与页面间的解耦,非常不利于后期的维护和功能的扩展.下面举个例子来说明一下这种做法的弊端. @cl ...
Angular CDK Overlay 弹出覆盖物
为什么使用Overlay? Overlay中文翻译过来意思是覆盖物,它是Material Design components for Angular中针对弹出动态内容这一场景的封装,功能强大.使用方便 ...
模拟layui弹出层
以前觉得自己手写一个类似layui的弹出层是挺遥远的事,因为完全没有头绪,即便在layui官网知道layui使用的都是C3动画之前试过控制width:0;height:0来做动画,结果惨不忍睹,直到 ...
python自动化弹框_Python+webdriver自动化脚本弹出框定位
弹窗类型:弹出框有两种: 页面弹出框(可定位元素能操作)----div-- Windows弹出框(不能直接定位)----alert,confirm,prompt-- 一.页面弹出框 div弹窗不需要切 ...
python如何判断是否有弹出框_Selenium2+python自动化47-判断弹出框存在(alert_is_present)【转载】...
前言系统弹窗这个是很常见的场景,有时候它不弹出来去操作的话,会抛异常.那么又不知道它啥时候会出来,那么久需要去判断弹窗是否弹出了. 一.判断alert源码分析 class alert_is_pres ...

动态获取姓名，弹出花名册

动态获取姓名，弹出花名册相关推荐

最新文章

热门文章