第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何利用事件委托給3個(gè)按鈕添加點(diǎn)擊事件,并彈出同一個(gè)但內(nèi)容不一樣的layer彈框?

如何利用事件委托給3個(gè)按鈕添加點(diǎn)擊事件,并彈出同一個(gè)但內(nèi)容不一樣的layer彈框?

守候你守候我 2019-03-15 18:13:15
如圖,給右邊3個(gè)話筒按鈕添加點(diǎn)擊事件,之前是給每個(gè)按鈕分別添加點(diǎn)擊事件可以,但是目前想用事件委托的方式添加,如何實(shí)現(xiàn)?代碼如下:<form action="" id="myform">    <div class="box">        <div class="num">            <label for="">保單號(hào)</label>            <input type="text" placeholder="請(qǐng)?zhí)顚?xiě)保單號(hào)"/>        </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="請(qǐng)輸入身份證號(hào)" 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="請(qǐng)?zhí)顚?xiě)銀行卡號(hào)"/>        </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:'請(qǐng)說(shuō)出保單號(hào)',            shadeClose: false,            style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',            content:$("#saying").html(),            btn:['確認(rèn)'],            yes:function(index){              layer.close(index)          },        })                 });    $(".icon-two").on("touchstart",function(){        layer.open({            title:'請(qǐng)說(shuō)出身份證號(hào)',            shadeClose: false,            style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',            content:$("#saying").html(),            btn:'確認(rèn)提交',            yes:function(index){                  layer.close(index)            },        })    });事件委托方式,給父元素添加點(diǎn)擊事件,因?yàn)橐獜棾霾煌膌ayer內(nèi)容,所以if做判斷,但是不對(duì),求解?
查看完整描述

5 回答

?
蠱毒傳說(shuō)

TA貢獻(xiàn)1895條經(jīng)驗(yàn) 獲得超3個(gè)贊

$(".num-btn").on("touchstart","span",function(event){

        var target = $(event.target);

        if(target.hasClass("icon-one")){

            layer.open({

                title:'請(qǐng)說(shuō)出保單號(hào)',

                shadeClose: false,

                style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',

                content:$("#saying").html(),

                btn:['確認(rèn)'],

                yes:function(index){

                  layer.close(index)

              },

            })

        }else if(target.hasClass("icon-two")){

            layer.open({

                title:'請(qǐng)說(shuō)出身份證號(hào)',

                shadeClose: false,

                style: 'width:5rem;border:none;background:linear-gradient(to right bottom,#f14f63,#7889fb);color:#fff;',

                content:$("#saying").html(),

                btn:'確認(rèn)提交',

                yes:function(index){

                      layer.close(index)

                },

            })

        }

    

})


查看完整回答
反對(duì) 回復(fù) 2019-03-26
?
當(dāng)年話下

TA貢獻(xiàn)1890條經(jīng)驗(yàn) 獲得超9個(gè)贊

具體邏輯沒(méi)看,但if($(".icon-one"))這種寫(xiě)法肯定是不對(duì)的,因?yàn)?code>$(".icon-one")返回的是個(gè)jQ對(duì)象,自動(dòng)轉(zhuǎn)換為true,這樣上邊的分支實(shí)際就變成常通了。
這種一般是要在事件回調(diào)中用到$(this),這個(gè)是jQ對(duì)e.target的一個(gè)封裝(相當(dāng)于$(e.target)),它返回的是jQ封裝的事件被觸發(fā)的那個(gè)DOM對(duì)象,而判斷是否包含一個(gè)類,則可以用.is()這個(gè)API。簡(jiǎn)而言之,寫(xiě)成if ( $(this).children().is(".icon-one") )吧。

查看完整回答
反對(duì) 回復(fù) 2019-03-26
?
紫衣仙女

TA貢獻(xiàn)1839條經(jīng)驗(yàn) 獲得超15個(gè)贊

判斷事件觸發(fā)的元素上的class是否為指定的class
在你代碼的這個(gè)地方
if($(".icon-one")){

查看完整回答
反對(duì) 回復(fù) 2019-03-26
?
智慧大石

TA貢獻(xiàn)1946條經(jīng)驗(yàn) 獲得超3個(gè)贊

判斷條件改為:


if($(this).children('span')===$('.icon-one')){

    ...

}


查看完整回答
反對(duì) 回復(fù) 2019-03-26
?
犯罪嫌疑人X

TA貢獻(xiàn)2080條經(jīng)驗(yàn) 獲得超4個(gè)贊

隨便寫(xiě)一個(gè)吧。也不知道這樣是不是你的意思:


<!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>


查看完整回答
反對(duì) 回復(fù) 2019-03-26
  • 5 回答
  • 0 關(guān)注
  • 2200 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)