javascript - js刪除一個清單內的某一行，同時刪除另一個清單內對應索引的行

Question

RT!
當點擊列表A中的某一行並執行刪除事件，然後刪除列表B內的對應的行，我想透過索引的方法實現。
但我在第一次執行刪除事件的時候，對應列表內刪除的是正確的對應行，但第二次執行事件的時候，列表A和B被刪除的行就對應不不上了，好像是列表A索引值，也就是發生點擊事件的列表，就算刪除了行，他的索引也不會變，但列表B中的索引就會自動減-，我用自減減的方法去調試，怎麼弄都不行，折騰一天了，實在是找不出問題所在了。希望大神解惑！ ！ ！
下面是我寫的測試程式碼

<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

雷雷

示範：
https://jsfiddle.net/ycloud/t...

Answer 2

簡單的做法是, 為 list01 列表裡的每一項添加一個 data-xxx 屬性, 點擊的時候
查詢 list02 里相同 data-xxx 屬性的 li, 然後刪除.

demo

Answer 3

汗.... 這種問題需要一天嗎？
each裡面的index是初始化的時候就確定了的，是1始終就是1，是2始終就是2，應該使用元素當前的index去刪除另外一個列表。
$('#list-2 li').each(function() {

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

廢話不多說，看程式碼吧：
http://jsfiddle.net/m6vhks4g/

有空到我的網站逛逛，新站沒什麼流量：http://www.aizelasi.club/