如图，给右边3个话筒按钮添加点击事件，之前是给每个按钮分别添加点击事件可以，但是目前想用事件委托的方式添加，如何实现？代码如下：<form action="" id="myform"> <div class="box"> <div class="num"> <label for="">保单号</label> <input type="text" placeholder="请填写保单号"/> </div> <div class="num-btn"> <span class="icon-one iconfont icon-qy-yy-h"></span> </div> </div> <div class="box"> <div class="idcard"> <label for="">身份证</label> <input type="text" placeholder="请输入身份证号" autocomplete="off"/> </div> <div class="num-btn"> <span class="icon-two iconfont icon-qy-yy-h"></span> </div> </div> <div class="box"> <div class="bcard"> <label for="">银行卡</label> <input type="text" placeholder="请填写银行卡号"/> </div> <div class="num-btn"> <span class="icon-three iconfont icon-qy-yy-h"></span> </div> </div></form>jquery代码如下 $(".icon-one").on("touchstart",function(){ layer.open({ title:'请说出保单号', shadeClose: false, style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;', content:$("#saying").html(), btn:['确认'], yes:function(index){ layer.close(index) }, }) }); $(".icon-two").on("touchstart",function(){ layer.open({ title:'请说出身份证号', shadeClose: false, style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;', content:$("#saying").html(), btn:'确认提交', yes:function(index){ layer.close(index) }, }) });事件委托方式，给父元素添加点击事件，因为要弹出不同的layer内容，所以if做判断，但是不对,求解？
5 回答
蛊毒传说
TA贡献1895条经验 获得超3个赞
$(".num-btn").on("touchstart","span",function(event){
var target = $(event.target);
if(target.hasClass("icon-one")){
layer.open({
title:'请说出保单号',
shadeClose: false,
style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',
content:$("#saying").html(),
btn:['确认'],
yes:function(index){
layer.close(index)
},
})
}else if(target.hasClass("icon-two")){
layer.open({
title:'请说出身份证号',
shadeClose: false,
style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',
content:$("#saying").html(),
btn:'确认提交',
yes:function(index){
layer.close(index)
},
})
}
})
当年话下
TA贡献1890条经验 获得超9个赞
具体逻辑没看，但if($(".icon-one"))这种写法肯定是不对的，因为$(".icon-one")返回的是个jQ对象，自动转换为true，这样上边的分支实际就变成常通了。
这种一般是要在事件回调中用到$(this)，这个是jQ对e.target的一个封装(相当于$(e.target))，它返回的是jQ封装的事件被触发的那个DOM对象，而判断是否包含一个类，则可以用.is()这个API。简而言之，写成if ( $(this).children().is(".icon-one") )吧。
犯罪嫌疑人X
TA贡献2080条经验 获得超4个赞
随便写一个吧。也不知道这样是不是你的意思：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button class="button A">button A</button>
<button class="button B">button B</button>
<button class="button C">button C</button>
<script src="jquery.js"></script>
<script>
$('body').on('click', '.button', function () {
var _this = $(this);
if (_this.hasClass('A')) {
alert('click A');
} else if (_this.hasClass('B')) {
alert('click B');
} else if (_this.hasClass('C')) {
alert('click C');
}
});
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消