javascript - js memadam baris tertentu dalam satu senarai dan memadam baris indeks yang sepadan dalam senarai lain

Question

RT!
Apabila baris tertentu dalam senarai A diklik dan acara padam dilaksanakan, dan kemudian baris yang sepadan dalam senarai B dipadamkan, saya ingin mencapai ini melalui kaedah indeks.
Tetapi apabila saya melaksanakan acara pemadaman untuk kali pertama, baris yang sepadan yang betul telah dipadamkan dalam senarai yang sepadan Namun, apabila saya melaksanakan acara itu untuk kali kedua, baris yang dipadamkan dalam senarai A dan B tidak dapat sepadan lagi nampaknya Nilai indeks senarai A, iaitu senarai tempat peristiwa klik berlaku, walaupun baris dipadamkan, indeksnya tidak akan berubah, tetapi indeks dalam senarai B akan berkurangan secara automatik -, saya menggunakan pengurangan automatik kaedah untuk menyahpepijat, bagaimana untuk melakukannya Tiada satu pun daripada mereka yang berfungsi Selepas bergelut selama sehari, saya benar-benar tidak dapat mencari masalah. Saya harap Tuhan dapat menjelaskan kekeliruan! ! !
Berikut ialah kod ujian yang saya tulis

<ul id="list-1">
        <li>我是列表list-1下的 旧内容 不删</li>
        <li>我是列表list-1下的 旧内容 不删</li>
        <li>我是列表list-1下的 旧内容 不删</li>
        <li>我是列表list-2动态添加过来的新内容第 0 条</li>
        <li>我是列表list-2动态添加过来的新内容第 1 条</li>
        <li>我是列表list-2动态添加过来的新内容第 2 条</li>
        <li>我是列表list-2动态添加过来的新内容第 3 条</li>
    </ul>
    <ul id="list-2">
        <li>我是列表list-2下的新内容第 0 条<input type="button" value="删除"></li>
        <li>我是列表list-2下的新内容第 1 条<input type="button" value="删除"></li>
        <li>我是列表list-2下的新内容第 2 条<input type="button" value="删除"></li>
        <li>我是列表list-2下的新内容第 3 条<input type="button" value="删除"></li>
    </ul>
    <script>
        $(function () {
            var x = $('#list-1 li').length;
            var y = $('#list-2 li').length;
            z = x - y;
            index = 0;
            $('#list-2 li').each(function(index) {
                $(this).on('click', function() {
                    $(this).remove();
                    var a = index+z;
                    $('#list-1 li').eq(a).remove();
                    alert(index)
                });
            });
        })
    </script>

Answer 1

$(function() {
  var $list1 = $('#list-1');
  var $list2 = $('#list-2');
  var z = $list1.find('li').length - $list2.find('li').length;
  $list2.on('click',
    'li',
    function() {
        var index = $(this).index()
      console.log(index)
      $(this).remove();
      $list1.find('li:eq('+ (index + z) +')').remove()
    });
})

demo:
https://jsfiddle.net/ycloud/t...

Answer 2

Cara mudahnya ialah dengan menambah atribut data-xxx pada setiap item dalam senarai list01,
pertanyakan li dengan atribut data-xxx yang sama dalam list02, dan kemudian padamkannya.

.

demo

Answer 3

Berpeluh...Masalah macam ni ambil masa sehari ke?
Indeks dalam setiap satu ditentukan semasa permulaan Jika ia adalah 1, ia akan sentiasa menjadi 1, jika ia adalah 2, ia akan sentiasa menjadi 2. Indeks semasa elemen harus digunakan untuk memadam senarai lain.
$('#list-2 li').setiap(fungsi() {

  $(this).on('click', function() {
    $('#list-1 li').eq($(this).index()+z).remove();
     $(this).remove();
  });
});

Tanpa berlengah lagi, mari lihat kod:
http://jsfiddle.net/m6vhks4g/

Pergi ke tapak web saya apabila anda mempunyai masa Laman web baharu tidak mempunyai banyak trafik: http://www.aizelasi.club/