- Vue获取当前元素
ACGuan
Vue
点击methods:{clickfun(e){//e.target是你当前点击的元素//e.currentTarget是你绑定事件的元素#获得点击元素的前一个元素e.currentTarget.previousElementSibling.innerHTML#获得点击元素的第一个子元素e.currentTarget.firstElementChild#获得点击元素的下一个元素e.currentTa
- vue-seamless-scroll 点击事件不生效
毛三仙
后台管理系统vue项目中常用操作大屏vue.js前端javascript
问题:在使用此插件时发现,列表内容前几行还是能正常点击的,但是从第二次出现的列表开始就没有点击事件了原因:因为html元素是复制出来的(滚动组件是将后面的复制出来一份,进行填铺页面,方便滚动)解决:往滚动组件的父节点上添加绑定事件(js冒泡机制),通过e.target定位到具体点击位置,然后判断点击位置是否是你滚动组件的一列/行具体实现0":data="companyList":class-opt
- react之旅(六)约束性和非约束性组件 input text radio select checkbox textarea 以及获取表单的内容
一天一丢丢
reactreact
一、约束性组件和非约束性组件1.1非约束性组件非约束性组件这样写:这里的defaultValue就是原生DOM的value,用户输入的值就是vaule的值,react完全不管输入的过程。1.2约束性组件约束性组件这样写:onChange=(e)=>{letdom=e.target;this.setState({name:dom.value})}这个时候,value的值不是用户输入的值,而是this
- 在vue事件中传入$event,使用e.target和e.currentTarget有什么区别
JJCTO
Vuevue.jsjavascript前端
在Vue中,事件处理是前端开发中非常重要的一部分。当我们在Vue中处理事件时,经常会用到事件对象event,而在事件对象中,有两个常用的属性:e.target和e.currentTarget。这两个属性在使用上有些细微的差别,本文将为大家详细介绍它们的区别和使用场景。首先我们来了解一下这两个属性的含义。在Vue事件中,e.target表示触发该事件的具体元素,而e.currentTarget表示当
- vue2编写一个自定义指令,一键绑定事件委托
外围前端吴彦祖
Vuevue.jsjavascript前端
importvuefrom"vue";constNAME="entrust";constINIT=(el,node)=>{if(elinstanceofHTMLElement){const{method,key,data}=node.value;el.onclick=(e)=>{constdom=e.target;if(dom.tagName){constindex=dom.dataset[key
- react实现手机号码验证
鞠婧祎yamy
#Reactreact.jsjavascript前端
Regular.jsximportReactfrom"react";classRegularextendsReact.Component{constructor(){super();this.state={tel:'',info:'',flag:false}}number=(e)=>{const{name,value}=e.target;var{info}=this.state;varphoneR
- 解决火狐和safira浏览器不支持e.path问题
guizi0809
vuejs基础javascript前端vue.js
场景:手写级联组件下拉框时,需要点击级联组件区域外触发事件来关闭下拉框//vue2.x点击元素外触发事件的指令Vue.directive("clickoutside",{//初始化指令bind(el,binding,vnode){functiondocumentHandler(e){//这里判断点击的元素是否是本身,是本身,则返回if(el.contains(e.target)){returnfa
- JS点击空白关闭弹窗的两种方式
小王子__
推荐写法$(document).mouseup(function(e){varpop=$('popDialog');if(!pop.is(e.target)&&pop.has(e.target).length===0){//可以在这里关闭弹窗somecode...}});判断点击事件发生在区域外的两个条件:1,点击事件的对象不是目标区域本身2,事件对象不是目标区域的子元素普通写法varbtn=do
- jquery语法知识(事件对象)
糖糖糖果88
jQueryjquery前端javascript
事件对象1、event.currentTarget事件的监听者2、event.target事件的目标p{width:100px;height:60px;background-color:red;}clickme$(function(){$("div").on("click",function(e){console.log($(e.currentTarget));console.log($(e.ta
- React进阶 - 15(React 中 ref 的使用)
w-somebody
react.jsjavascript前端
本章内容目录一、e.target获取事件对应“元素”的DOM节点二、ref三、ref和setState合用上一节我们了解了React中的”虚拟DOM“中的”Diff算法““,本节我们来说一说React中ref的使用一、e.target获取事件对应“元素”的DOM节点打开之前工程中的TodoList.js代码需求:当input框中的数据变化时,要求拿到这个input框节点DOM这个需求我们可以使用最
- 每天10个前端小知识 <Day 1>
前端小天才
前端
前端面试基础知识题1.将数组的length设置为0,取第一个元素会返回什么?设置length=0会清空数组,所以会返回undefined2.e.target和e.currentTarget有什么区别?e.target:触发事件的元素e.currentTarget:绑定事件的元素3.如何获取到一个实例对象的原型对象?从构造函数获得原型对象:构造函数.prototype从对象实例获得父级原型对象:方法
- JS 事件对象|事件目标|阻止默认事件|阻止冒泡
working_Poor
1、事件对象functioneventSrc(e){e=e||window.event}2、事件目标functioneventTarget(e){e=e||window.eventvartarget=e.target||e.srcElement}3、阻止事件冒泡functionstopPro(e){e=e||window.evente.stopPropagation?(e.stopPropagat
- 22.Vue 监听input事件,并获取值
圆梦人生
在Vue中通过监听js的oninput事件,并获取输入的值,参考案例:案例:下面是一个输入框,监听了oninput事件:输入的值是:{{inputValue}}exportdefault{data(){return{inputValue:''}},methods:{inputFun(e){//e.target指向了dom元素this.inputValue=e.target.value;//...}
- vue文件下载与js方法
JianZhen✓
日常开发htmlvue.jsjavascript前端elementui
1.字符串的search方法,默认是不忽略大小写,'111'.search('1'),会搜索到第一个匹配的字符后返回其下标——0,如果没匹配到就会返回-12.VUE获取当前点击元素,我们可以做到点击子元素修改父元素的属性值或修改当前元素的属性值等操作所属地域seeIt(e){console.log('e:>>',e);//e.target是你当前点击的元素//e.currentTarget是你绑定
- DOM事件
小小的开发人员
事件流严格来说,上图还少了一个层级window,在顶层。DOM2级与DOM0级相比1、可以绑定多个监听函数,而DOM0级只能绑定一个监听函数。2、提供了移除的方法,但对于匿名函数无效。3、可以控制捕获还是冒泡,DOM0级只有冒泡。事件对象e的常用属性方法e.stopImmediatePropagation()如果注册了多个监听函数,则一并阻止冒泡。e.currentTarget绑定时间的对象,始终
- react中的受控组件和非受控组件
You_d39d
受控组件就是受到state控制importReact,{Component}from'react'exportdefaultclassAppextendsComponent{constructor(){super()this.state={username:""}}changeHandler=(e)=>{console.log("e",e.target);let{value,name}=e.tar
- (十)React 中 ref 的使用及坑
云凡的云凡
帮助我们在React中获取DOM元素在React里面,可以用e.target获取到事件对应的元素,也可以用ref;1.e.target//使用e.targethandleInputChange(e){console.log(e.target);//const{value}=e.target;this.setState(()=>({inputValue:value,}));ref不推荐,有时候set
- 点击其他区域关闭弹窗
爱学习的小青蛙
varcloseTips=function(){$(document).mousedown(function(e){varpop=$('目标区域');if(!pop.is(e.target)&&pop.has(e.target).length===0){//点击对象不是目标区域本身,也不是目标区域的子元素$('目标区域').hide();somecode...//功能代码}})}//手机$(doc
- el-table 个体行绑定点击事件时 表格中有el-radio和el-checkbox 点击触发两次事件处理方法
stpzhf
vue.jsjavascript前端
前言el-table个体行绑定点击事件时表格中有el-radio和el-checkbox点击触发两次事件处理方法一、问题重现当不点击单选按钮时就正常不会出问题当点击单选框时点击事件会执行两次 二、解决方式代码如下(示例)://参数rowcole事件onRows(row,c,e){//因为单选框和复选框底层都是input所以判断tagName===input不处理就行if(e.target
- 如何在项目中使用事件对象
十步杀一人_千里不留行
前端相关javascript
了解事件对象首先,理解事件对象(通常在事件处理函数中表示为e或event)是理解任何JavaScript事件处理的关键。这个对象包含了关于发生事件的所有信息,例如:哪个元素触发了事件(e.target)事件的类型(点击、按键等)(e.type)事件发生的时间(e.timeStamp)用户的鼠标位置(e.clientX和e.clientY)是否按下了修饰键(如Shift或Ctrl)(e.shiftK
- vue中input禁止输入中文_vue 中input的输入限制
weixin_39950772
vue中input禁止输入中文
在vue中用最普通的input对内容做限制比较容易,但是没有样式,比较丑,比如只能输入文字(以下都以文字为例),直接对其值正则匹配即可>查看其他匹配的方法<但是想要好看一点的就需要使用vue中的输入框Input(当然也可以去给普通的调样式),但是验证的方法和普通的有些区别如果使用了iview中的Input组件验证的方法inputChange(e){constval=e.target;val.val
- jQuery中获取点击事件的元素及元素的id属性
@小花76
jqueryjquery
新问题:怎么获取到点击的元素呢?在jQuery中,当想获取点击的元素时,我们可以用下面的方法,代码如下:$('.top-menu.el-menu-item').click(function(e){varv=$(e.target);//获取当前点击事件的元素});当你获取当前的元素后,就可以对元素进行操作了,比如获取元素的innerHTML,代码如下:$('.top-menu.el-menu-ite
- #名词区别篇:事件流&事件委托&白屏时间&首屏时间
Random_index
名词区别篇前端javascript开发语言
事件流事件捕获—从外到内到达目标事件冒泡—从内到外事件委托定义:当有大量子元素触发事件时,将事件监听器绑定在父元素进行监听,此时数百个事件监听器变成一个监听器。e.currentTarget与e.target有何区别Event接口的只读属性currentTarget表示的,标识是当事件沿着DOM触发时事件的当前目标。它总是指向事件绑定的元素,而Event.target则是事件触发的元素。addEv
- 前端通过canvas压缩图片
一路追求匠人精神
前端算法javascript
//通过canvas压缩图像constcompressImage=(file:File):Promise=>{returnnewPromise((resolve,reject)=>{constreader=newFileReader()reader.onload=(e:ProgressEvent)=>{constimg=newImage()img.src=e.target?.resultasstr
- 前端将blob转换为可下载的url及下载
一路追求匠人精神
前端javascript开发语言
一.转换//将blob转换为urlconstchangeBlobToUrl=blobData=>{returnnewPromise(resolve=>{//创建Blob对象constblob=newBlob([blobData])//创建FileReader对象constreader=newFileReader()reader.onload=function(e){resolve(e.target
- 父元素除子元素外点击隐藏父元素
西西_80ff
$(".help").click(function(e){if(e.target==this){$(".help").hide();}})
- js事件目标查找方式,事件代理,e.target与e.currentTarget的区别,阻止冒泡与捕获,取消默认事件一次搞懂,看这个就够了
coder_zengjc
javascriptjavascriptjs
文章目录一、EventTarget事件目标的查找方式(冒泡与捕获)冒泡与捕获:冒泡事件:捕获事件:addEventListener(type,listener,useCapture)简单分析:参数useCapture解析:冒泡与捕获的顺序分析:代码演示:二、事件代理机制(事件委托)利用事件冒泡完成事件代理机制:三、e.target与e.currentTarget的区别:四、阻止冒泡与捕获为什么要阻
- 树型数据筛选,过滤,和查找某一个,从树型数据中把所有的子节点取出来
且菜且折腾
jsjavascript前端
树结构的数据筛选constfilters=(e:any)=>{let{value}=e.target;letd=JSON.parse(JSON.stringify(treeDataOld));letdatax=filtersX(value,d);setTreedata(datax);};constfiltersX=(val:any,data:Array)=>{data.forEach((item:
- JS原生实现 contenteditable 属性的 onchange 事件
川哥编程
javascript前端
ThisisaString.functiontext1_change(sef){sef.setAttribute('data-old',sef.innerHTML);addEvent(sef,'blur',text1_blur);}functiontext1_blur(e){varsef=e.target||e.srcElement,val=sef.innerHTML;delEvent(sef,'
- 如何判定API接口是否支持跨域访问
zhishidi
问题解决ajax跨域问题
1.背景同一个h5页面需要访问多个不同的域名下的地址2.判定方式方式一在浏览器控制台执行如下代码:varxhr=newXMLHttpRequest();xhr.open('GET','https://XXXX.XXX.com/api/order/query');//测试时改为自己的地址xhr.send(null);xhr.onload=function(e){varxhr=e.target;con
- JAVA基础
灵静志远
位运算加载Date字符串池覆盖
一、类的初始化顺序
1 (静态变量,静态代码块)-->(变量,初始化块)--> 构造器
同一括号里的,根据它们在程序中的顺序来决定。上面所述是同一类中。如果是继承的情况,那就在父类到子类交替初始化。
二、String
1 String a = "abc";
JAVA虚拟机首先在字符串池中查找是否已经存在了值为"abc"的对象,根
- keepalived实现redis主从高可用
bylijinnan
redis
方案说明
两台机器(称为A和B),以统一的VIP对外提供服务
1.正常情况下,A和B都启动,B会把A的数据同步过来(B is slave of A)
2.当A挂了后,VIP漂移到B;B的keepalived 通知redis 执行:slaveof no one,由B提供服务
3.当A起来后,VIP不切换,仍在B上面;而A的keepalived 通知redis 执行slaveof B,开始
- java文件操作大全
0624chenhong
java
最近在博客园看到一篇比较全面的文件操作文章,转过来留着。
http://www.cnblogs.com/zhuocheng/archive/2011/12/12/2285290.html
转自http://blog.sina.com.cn/s/blog_4a9f789a0100ik3p.html
一.获得控制台用户输入的信息
&nbs
- android学习任务
不懂事的小屁孩
工作
任务
完成情况 搞清楚带箭头的pupupwindows和不带的使用 已完成 熟练使用pupupwindows和alertdialog,并搞清楚两者的区别 已完成 熟练使用android的线程handler,并敲示例代码 进行中 了解游戏2048的流程,并完成其代码工作 进行中-差几个actionbar 研究一下android的动画效果,写一个实例 已完成 复习fragem
- zoom.js
换个号韩国红果果
oom
它的基于bootstrap 的
https://raw.github.com/twbs/bootstrap/master/js/transition.js transition.js模块引用顺序
<link rel="stylesheet" href="style/zoom.css">
<script src=&q
- 详解Oracle云操作系统Solaris 11.2
蓝儿唯美
Solaris
当Oracle发布Solaris 11时,它将自己的操作系统称为第一个面向云的操作系统。Oracle在发布Solaris 11.2时继续它以云为中心的基调。但是,这些说法没有告诉我们为什么Solaris是配得上云的。幸好,我们不需要等太久。Solaris11.2有4个重要的技术可以在一个有效的云实现中发挥重要作用:OpenStack、内核域、统一存档(UA)和弹性虚拟交换(EVS)。
- spring学习——springmvc(一)
a-john
springMVC
Spring MVC基于模型-视图-控制器(Model-View-Controller,MVC)实现,能够帮助我们构建像Spring框架那样灵活和松耦合的Web应用程序。
1,跟踪Spring MVC的请求
请求的第一站是Spring的DispatcherServlet。与大多数基于Java的Web框架一样,Spring MVC所有的请求都会通过一个前端控制器Servlet。前
- hdu4342 History repeat itself-------多校联合五
aijuans
数论
水题就不多说什么了。
#include<iostream>#include<cstdlib>#include<stdio.h>#define ll __int64using namespace std;int main(){ int t; ll n; scanf("%d",&t); while(t--)
- EJB和javabean的区别
asia007
beanejb
EJB不是一般的JavaBean,EJB是企业级JavaBean,EJB一共分为3种,实体Bean,消息Bean,会话Bean,书写EJB是需要遵循一定的规范的,具体规范你可以参考相关的资料.另外,要运行EJB,你需要相应的EJB容器,比如Weblogic,Jboss等,而JavaBean不需要,只需要安装Tomcat就可以了
1.EJB用于服务端应用开发, 而JavaBeans
- Struts的action和Result总结
百合不是茶
strutsAction配置Result配置
一:Action的配置详解:
下面是一个Struts中一个空的Struts.xml的配置文件
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
&quo
- 如何带好自已的团队
bijian1013
项目管理团队管理团队
在网上看到博客"
怎么才能让团队成员好好干活"的评论,觉得写的比较好。 原文如下: 我做团队管理有几年了吧,我和你分享一下我认为带好团队的几点:
1.诚信
对团队内成员,无论是技术研究、交流、问题探讨,要尽可能的保持一种诚信的态度,用心去做好,你的团队会感觉得到。 2.努力提
- Java代码混淆工具
sunjing
ProGuard
Open Source Obfuscators
ProGuard
http://java-source.net/open-source/obfuscators/proguardProGuard is a free Java class file shrinker and obfuscator. It can detect and remove unused classes, fields, m
- 【Redis三】基于Redis sentinel的自动failover主从复制
bit1129
redis
在第二篇中使用2.8.17搭建了主从复制,但是它存在Master单点问题,为了解决这个问题,Redis从2.6开始引入sentinel,用于监控和管理Redis的主从复制环境,进行自动failover,即Master挂了后,sentinel自动从从服务器选出一个Master使主从复制集群仍然可以工作,如果Master醒来再次加入集群,只能以从服务器的形式工作。
什么是Sentine
- 使用代理实现Hibernate Dao层自动事务
白糖_
DAOspringAOP框架Hibernate
都说spring利用AOP实现自动事务处理机制非常好,但在只有hibernate这个框架情况下,我们开启session、管理事务就往往很麻烦。
public void save(Object obj){
Session session = this.getSession();
Transaction tran = session.beginTransaction();
try
- maven3实战读书笔记
braveCS
maven3
Maven简介
是什么?
Is a software project management and comprehension tool.项目管理工具
是基于POM概念(工程对象模型)
[设计重复、编码重复、文档重复、构建重复,maven最大化消除了构建的重复]
[与XP:简单、交流与反馈;测试驱动开发、十分钟构建、持续集成、富有信息的工作区]
功能:
- 编程之美-子数组的最大乘积
bylijinnan
编程之美
public class MaxProduct {
/**
* 编程之美 子数组的最大乘积
* 题目: 给定一个长度为N的整数数组,只允许使用乘法,不能用除法,计算任意N-1个数的组合中乘积中最大的一组,并写出算法的时间复杂度。
* 以下程序对应书上两种方法,求得“乘积中最大的一组”的乘积——都是有溢出的可能的。
* 但按题目的意思,是要求得这个子数组,而不
- 读书笔记-2
chengxuyuancsdn
读书笔记
1、反射
2、oracle年-月-日 时-分-秒
3、oracle创建有参、无参函数
4、oracle行转列
5、Struts2拦截器
6、Filter过滤器(web.xml)
1、反射
(1)检查类的结构
在java.lang.reflect包里有3个类Field,Method,Constructor分别用于描述类的域、方法和构造器。
2、oracle年月日时分秒
s
- [求学与房地产]慎重选择IT培训学校
comsci
it
关于培训学校的教学和教师的问题,我们就不讨论了,我主要关心的是这个问题
培训学校的教学楼和宿舍的环境和稳定性问题
我们大家都知道,房子是一个比较昂贵的东西,特别是那种能够当教室的房子...
&nb
- RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系
daizj
oraclermanfilespersetPARALLELISM
RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系 转
PARALLELISM ---
我们还可以通过parallelism参数来指定同时"自动"创建多少个通道:
RMAN > configure device type disk parallelism 3 ;
表示启动三个通道,可以加快备份恢复的速度。
- 简单排序:冒泡排序
dieslrae
冒泡排序
public void bubbleSort(int[] array){
for(int i=1;i<array.length;i++){
for(int k=0;k<array.length-i;k++){
if(array[k] > array[k+1]){
- 初二上学期难记单词三
dcj3sjt126com
sciet
concert 音乐会
tonight 今晚
famous 有名的;著名的
song 歌曲
thousand 千
accident 事故;灾难
careless 粗心的,大意的
break 折断;断裂;破碎
heart 心(脏)
happen 偶尔发生,碰巧
tourist 旅游者;观光者
science (自然)科学
marry 结婚
subject 题目;
- I.安装Memcahce 1. 安装依赖包libevent Memcache需要安装libevent,所以安装前可能需要执行 Shell代码 收藏代码
dcj3sjt126com
redis
wget http://download.redis.io/redis-stable.tar.gz
tar xvzf redis-stable.tar.gz
cd redis-stable
make
前面3步应该没有问题,主要的问题是执行make的时候,出现了异常。
异常一:
make[2]: cc: Command not found
异常原因:没有安装g
- 并发容器
shuizhaosi888
并发容器
通过并发容器来改善同步容器的性能,同步容器将所有对容器状态的访问都串行化,来实现线程安全,这种方式严重降低并发性,当多个线程访问时,吞吐量严重降低。
并发容器ConcurrentHashMap
替代同步基于散列的Map,通过Lock控制。
&nb
- Spring Security(12)——Remember-Me功能
234390216
Spring SecurityRemember Me记住我
Remember-Me功能
目录
1.1 概述
1.2 基于简单加密token的方法
1.3 基于持久化token的方法
1.4 Remember-Me相关接口和实现
- 位运算
焦志广
位运算
一、位运算符C语言提供了六种位运算符:
& 按位与
| 按位或
^ 按位异或
~ 取反
<< 左移
>> 右移
1. 按位与运算 按位与运算符"&"是双目运算符。其功能是参与运算的两数各对应的二进位相与。只有对应的两个二进位均为1时,结果位才为1 ,否则为0。参与运算的数以补码方式出现。
例如:9&am
- nodejs 数据库连接 mongodb mysql
liguangsong
mongodbmysqlnode数据库连接
1.mysql 连接
package.json中dependencies加入
"mysql":"~2.7.0"
执行 npm install
在config 下创建文件 database.js
- java动态编译
olive6615
javaHotSpotjvm动态编译
在HotSpot虚拟机中,有两个技术是至关重要的,即动态编译(Dynamic compilation)和Profiling。
HotSpot是如何动态编译Javad的bytecode呢?Java bytecode是以解释方式被load到虚拟机的。HotSpot里有一个运行监视器,即Profile Monitor,专门监视
- Storm0.9.5的集群部署配置优化
roadrunners
优化storm.yaml
nimbus结点配置(storm.yaml)信息:
# Licensed to the Apache Software Foundation (ASF) under one
# or more contributor license agreements. See the NOTICE file
# distributed with this work for additional inf
- 101个MySQL 的调节和优化的提示
tomcat_oracle
mysql
1. 拥有足够的物理内存来把整个InnoDB文件加载到内存中——在内存中访问文件时的速度要比在硬盘中访问时快的多。 2. 不惜一切代价避免使用Swap交换分区 – 交换时是从硬盘读取的,它的速度很慢。 3. 使用电池供电的RAM(注:RAM即随机存储器)。 4. 使用高级的RAID(注:Redundant Arrays of Inexpensive Disks,即磁盘阵列
- zoj 3829 Known Notation(贪心)
阿尔萨斯
ZOJ
题目链接:zoj 3829 Known Notation
题目大意:给定一个不完整的后缀表达式,要求有2种不同操作,用尽量少的操作使得表达式完整。
解题思路:贪心,数字的个数要要保证比∗的个数多1,不够的话优先补在开头是最优的。然后遍历一遍字符串,碰到数字+1,碰到∗-1,保证数字的个数大于等1,如果不够减的话,可以和最后面的一个数字交换位置(用栈维护十分方便),因为添加和交换代价都是1