javascript - Wie gehe ich mit wiederholten Bindungsereignissen um?

WBOY
Freigeben: 2023-03-01 18:16:01
Original
1228 Leute haben es durchsucht

javascript - Wie gehe ich mit wiederholten Bindungsereignissen um?
Das Popup-Fenster zum Aufheben der Bindung ist öffentlich. Woher weiß ich, wenn ich auf „Bestätigen und Abbrechen“ klicke, dass der Entbindungsvorgang (entsprechende Entfernung des Bankkartendoms) von
javascript - Wie gehe ich mit wiederholten Bindungsereignissen um?
auf der entsprechenden Bankkarte

angeklickt wird
<code><!-- 银行卡列表 -->
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>

<!-- 解绑成功 -->
<div class="unbind-confirm">
    <p>确定解绑该银行卡吗?</p>
    <hr>
    <div class="unbind-option clearfix">
        <div class="unbind-cancel">取消</div>
        <div class="unbind-sure">确认</div>
    </div>
</div></code>
Nach dem Login kopieren
Nach dem Login kopieren

Antwortinhalt:

javascript - Wie gehe ich mit wiederholten Bindungsereignissen um?
Das Popup-Fenster zum Aufheben der Bindung ist öffentlich. Woher weiß ich, wenn ich auf „Bestätigen und Abbrechen“ klicke, dass der Entbindungsvorgang (entsprechende Entfernung des Bankkartendoms) von
javascript - Wie gehe ich mit wiederholten Bindungsereignissen um?
auf der entsprechenden Bankkarte

angeklickt wird
<code><!-- 银行卡列表 -->
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>
    <div class="bankcard-block">
        <div class="bankcard-item">
            <img class="card-img" src="<{$style}>statics/images/yinlianzhifuicon.png">
            <div class="card-info">
                <p class="card-name">建设银行</p>
                <p class="card-type">储蓄卡</p>
                <p class="card-number">****  ****  **** <label>6535</label></p>
            </div>
            <div class="ubind-card">解绑</div>
        </div>
    </div>

<!-- 解绑成功 -->
<div class="unbind-confirm">
    <p>确定解绑该银行卡吗?</p>
    <hr>
    <div class="unbind-option clearfix">
        <div class="unbind-cancel">取消</div>
        <div class="unbind-sure">确认</div>
    </div>
</div></code>
Nach dem Login kopieren
Nach dem Login kopieren

<code>用 jquery 的 方式
$('.ubind-card').click(function(){
    //的到当前银行卡列表的下标
    var ubindIndex = $(this).parents('.bankcard-block').index();
    //给确定按钮赋一个标识
    $('.unbind-sure').attr('val',ubindIndex ).show();
});
$('.unbind-sure').click(function(){
    var index = $(this).attr('val');
    $('.bankcard-block:eq('+index+')').remove();
});
</code>
Nach dem Login kopieren

Wenn möglich, hoffe ich, es zu übernehmen

Es ist ganz einfach. Wenn der Benutzer zum Aufheben der Bindung klickt, können Sie die Informationen darüber, auf welche Bankkarte der Benutzer geklickt hat, mit den Eigenschaften der Popup-Box-Beschriftung verknüpfen. Sie können beispielsweise die Seriennummer der Bankkarte daran binden, so <div class="unbind-confirm" data-bankIndex="1">. Wenn der Benutzer zur Bestätigung klickt, können Sie einfach nach oben gehen, um es abzurufen.

Rufen Sie das event.targetevent.currentTargetJavaScript-EreignisobjektDOM über
oder

ab

Verwenden Sie eine Variable, um die aktuell betriebene Karte zu speichern.

<code class="javascript">var currentCart = -1;//默认-1
$('#cards').on('click','.btnJieBang',function(){
currentCart=this.dataset.cartid;
});
//弹窗确定的事件里,去读取currentCart变量即可</code>
Nach dem Login kopieren

Wenn Sie auf „Binden aufheben“ klicken, können Sie das übergeordnete Element abrufen und es dann durch entsprechende Vorgänge löschen, um Ihr Ziel zu erreichen.

Entbinden Sie die Verbindung und fügen Sie eine unterscheidbare Daten-ID hinzu

Binden Sie eine eindeutige Kennung

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!