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

為了賬號安全，請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

在jquery中刪除時動態(tài)更改表行ID

在jquery中刪除時動態(tài)更改表行ID

墨色風(fēng)雨 2022-10-13 15:48:03
html    <table class="table table-bordered listable">        <thead>            <tr class="text-center">                <th>name</th>                <th>amount</th>                <th style="text-align:center">                   <a href="#" class="btn btn-info addRow">+</a>                 </th>             </tr>         </thead>         <tbody class="text-center">             <tr class="cb" id="row_0">                <td width="20%">                  <select class="form-control select2 firstname v1" id="name1_0" name="name[]" style="width: 100%;">                       <option id="1">tan</option><option id="2">lim</option>                  </select></td>                <td width="20%"><input type="number" name="winlose[]" id="amt1_0" class="form-control first"></td>                                                            <td width="20%"><a href="#" class="btn btn-danger remove">-</a></td>             </tr>          </tbody>         </table> <button type="button" class="btn btn-primary savebtn">Save</button>jQuery        $('.addRow').on('click', function(){            addRow();                  });function addRow()        {           var rowCount = $('.listable tr').length -1;            var tr  = '<tr class="cb" id="row_'+rowCount+'"><td>';            tr  += '<select class="form-control select2" id="name1_'+rowCount+' first" name="name[]">';            tr  += '<option id="1">tan</option><option id="2">lim</option></select></td>';            tr  += '<td><input type="number" name="winlose[]" id="amt1_'+rowCount+'" class="form-control"></td>';                          tr  += '<td style="text-align:center"><a href="#" class="btn btn-danger remove">-</a>';            tr  += '</td></tr>';        i++;            $('tbody').append(tr);        }        $('tbody').on('click', '.remove', function(){            $(this).parent().parent().remove();        });        當(dāng)我單擊按鈕時，這將動態(tài)添加表行或刪除行。之后，如果用戶刪除第二行，則行 id 2 已被刪除，行 id 應(yīng)動態(tài)交換。有誰知道如何解決這一問題 ：（？
查看完整描述

3 回答

?
一只甜甜圈

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

您不需要 id 從輸入元素中獲取值，我們可以輕松地動態(tài)獲取每個輸入的值，檢查下面的代碼。


$('.savebtn').on('click', function(){

   $('.listable .cb').each(function(index, item){

        console.log($(item).find('input[type=number]').val());

   });

});

https://jsfiddle.net/n7dzhwk4/


查看完整回答
反對 回復(fù) 2022-10-13
?
智慧大石

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

我認(rèn)為一個更明智的選擇是交換值，而不是更改 ID。您可以通過將onclickfor delete 操作更改為：


        $('tbody').on('click', '.remove', function(){

            elements = $(".cb");

            current = parseInt($(this).id);

            for (let itr = current; itr < elements.length - 1; itr++) {

                elements[itr].value = elements[itr + 1].value;

            }

            elements[elements.length - 1].remove();

            i--;

        });

這是代碼：https ://jsfiddle.net/ckpLqs4g/


查看完整回答
反對 回復(fù) 2022-10-13
?
隔江千里

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

試試這個，實際上這不是解決這個問題的最佳方法，你真的不需要動態(tài)更改 id 但我希望這會對你有所幫助


$('.addRow').on('click', function(){

            addRow();

          

        });

function addRow()

        {

           var rowCount = $('.listable tr').length -1;

            var tr  = '<tr class="cb" id="row_'+rowCount+'"><td>';

            tr  += '<select class="form-control select2" id="name1_'+rowCount+' first" name="name[]">';

            tr  += '<option id="1">tan</option><option id="2">lim</option></select></td>';

            tr  += '<td><input type="number" name="winlose[]" id="amt1_'+rowCount+'" class="form-control"></td>';   

           

            tr  += '<td style="text-align:center"><a href="#" class="btn btn-danger remove">-</a>';

            tr  += '</td></tr>';    

    i++;

let elementCount = 0

            $('tbody').append(tr);

$('tbody').children('tr').each(function () {

    this.attr('id',`row_${elementCount}`);

  elementCount++;

});


        }


        $('tbody').on('click', '.remove', function(){

            $(this).parent().parent().remove();

        });

        

        $('.savebtn').on('click', function(){

        $('.listable .cb').each(function(index, item){

                console.log($('#amt1_'+index).val());

               

            });

            });


查看完整回答
反對 回復(fù) 2022-10-13
  • 3 回答
  • 0 關(guān)注
  • 130 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號

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