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

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

如何比較價(jià)值

如何比較價(jià)值

阿晨1998 2022-05-22 11:29:15
當(dāng)我單擊成功添加的按鈕時(shí),如何在多次單擊按鈕時(shí)將值添加到先前的值。$(document).ready(function() {  $('.btn').click(function() {    var btn = $(this);    var count = btn.data("count");    var name = btn.data("name");    var price = btn.data("price")    console.log(name + price)    $('.display').append('<h2>' + name + '</h2> ' + count + ' pc. price = ' + price)  });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><button data-name="Buterbrod" data-price="140" data-count="1" class="btn" type='submit'>        <p>Buterbrod</p>        <p class="price">140</p>    </button><button data-name="hotdog" data-price="110" data-count="1" class="btn" type='submit'>        <p>hotdog</p>        <p class="price">110</p>    </button><div class="display"></div>
查看完整描述

3 回答

?
四季花海

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

只需創(chuàng)建容器以從一開(kāi)始就保存預(yù)期值,但用零填充它的價(jià)格和數(shù)字。然后,當(dāng)單擊按鈕時(shí),只需添加這些數(shù)字。


編輯1:如果您有太多產(chǎn)品,只需使用“如果不存在”邏輯動(dòng)態(tài)添加那些“零容器”


編輯 2:建議使用 ID 表示每個(gè)產(chǎn)品。ID 可以是數(shù)據(jù)庫(kù)主鍵、slug 或任何不包含空格或數(shù)字的內(nèi)容。


$( document ).ready(function() {

    //$('.container_product').css('display','none');

    $('.btn').click(function(){

        var btn = $(this);

        var count =  btn.data("count");

        var identifier =  btn.data("identifier");

        var name = btn.data("name");

        var price = btn.data("price")

        //console.log(name + price)

        //$('.display').append('<h2>'+ name + '</h2> ' + count + ' pc. price = ' + price)

        if($("#container_"+identifier).length == 0) { // if not exist

            $(".display").append(`

                <span id="container_`+identifier+`" class="container_product">

                    <h2>`+name+`</h2>

                    <span id="num_`+identifier+`">0</span> pc. 

                    price = <span id="price_`+identifier+`">0</span>

                </span>

            `)

        }

        

        $("#container_"+identifier).css('display','block');

        $("#price_"+identifier).html(  parseInt($("#price_"+identifier).html())+price  );

        $("#num_"+identifier).html(  parseInt($("#num_"+identifier).html())+1  );

        

    });


});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button data-name="buterbrod" data-price="140" data-count="1" data-identifier="1" class="btn" type='submit'>

    <p>Buterbrod</p>

    <p class="price">140</p>

</button>

<button data-name="hotdog" data-price="110" data-count="1" data-identifier="2" class="btn" type='submit'>

    <p>hotdog</p>

    <p class="price">110</p>

</button>

<button data-name="double buterbrod" data-price="9999" data-count="1" data-identifier="3" class="btn" type='submit'>

    <p>double buterbrod</p>

    <p class="price">9999</p>

</button>


<div class="display">

</div>


查看完整回答
反對(duì) 回復(fù) 2022-05-22
?
有只小跳蛙

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

先在'display'元素中找到附加的元素,如果它的長(zhǎng)度為0,則直接附加它,否則首先獲取data-price屬性的值并將更新后的價(jià)格添加到它。


$(document).ready(function() {

  $('.btn').click(function() {

    var btn = $(this);

    var count = Number(btn.data("count"));

    var name = btn.data("name");

    var price = Number(btn.data("price"));


    var $h2 = $("<h2></h2>")

      .attr('data-name', name)

      .attr('data-count', count)

      .attr('data-price', price)

      .text(name + ' ' + count + ' pc. price = ' + price);



    var dataNameSelector = '*[data-name=' + name + ']';

    var childrenOrders = $('.display').find(dataNameSelector);


    if (childrenOrders.length === 0) {

      $('.display').append($h2);

    } else {

      var updatedPrice = Number(childrenOrders.data('price')) + price;

      var updatedCount = Number(childrenOrders.data('count')) + count;

      childrenOrders.data('price', updatedPrice);

      childrenOrders.data('count', updatedCount);

      childrenOrders.text(name + ' ' + updatedCount + ' pc. price = ' + updatedPrice);

    }

  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button data-name="Buterbrod" data-price="140" data-count="1" class="btn" type='submit'>

    <p>Buterbrod</p>

    <p class="price">140</p>

</button>

<button data-name="hotdog" data-price="110" data-count="1" class="btn" type='submit'>

    <p>hotdog</p>

    <p class="price">110</p>

</button>


<div class="display"></div>


查看完整回答
反對(duì) 回復(fù) 2022-05-22
?
守候你守候我

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

可以使用您的代碼輕松完成,append容器中的內(nèi)容 a 給出 a class,下次只需檢查該容器是否已經(jīng)存在,然后insert進(jìn)入html該容器。另外,您還需要不斷更新count變量。


$(document).ready(function() {

  $('.btn').click(function() {

    var btn = $(this);

    var data = btn.data();

    var count = data.count;

    var name = data.name;

    var price = data.price * count;

    data.count = count + 1;

    var html = '<h2>' + name + '</h2> ' + count + ' pc. price = ' + price;

    name = name.split(" ").join("_");

    if($('.display').find("."+name).length)

      $('.display').find("."+name).html(html);

    else    

      $('.display').append($("<div class='"+name+"'></div>").html(html));

  });


});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button data-name="Buterbrod" data-price="140" data-count="1" class="btn" type='submit'>

        <p>Buterbrod</p>

        <p class="price">140</p>

    </button>

<button data-name="hotdog" data-price="110" data-count="1" class="btn" type='submit'>

        <p>hotdog</p>

        <p class="price">110</p>

    </button>


<div class="display"></div>


查看完整回答
反對(duì) 回復(fù) 2022-05-22
  • 3 回答
  • 0 關(guān)注
  • 103 瀏覽
慕課專欄
更多

添加回答

舉報(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)