Question

我有一段jquerty代码，其中的表结构是这样的：

<table>
    <tr><td><button class="selectItems"><i class="fa faplus"></i></button</td></tr> 1
    <tr><td><button class="selectItems"><i class="fa faplus"></i></button</td></tr> 2
    <tr style="color:red"><td></tr> 3
    <tr><td><button class="selectItems"><i class="fa faplus"></i></button</td></tr> 4 
    <tr><td><button class="selectItems"><i class="fa faplus"></i></button</td></tr> 5
</table>




$(".SelectItems").click(function() {
 var ele = $(this);
 var findprev = $(this).closest('tr').prev();
 if (!(findprev).find('td button i').hasClass('fa-trash') == true) {
            alert("Bad data");
            return;
        }
 });

我要在这里尝试的是如果我的父母是：3并且如果我选择5，它应该显示一个错误，它是无效序列。所以在选择5之前我必须选择4。

上述情况相同：我可以在1之前选择2来继续序列，不能选择1

但是当我选择4时，它应该跳过父检查，因为那是我要绑定到的地方，因此，如果我在4之后选择2，则应该将其视为一个序列，因为3是父

Answer 1

尝试一下：

    $(document).ready(function () {
        var sequence = [];
        
        $('.parent').on('click',function(e) {
        		sequence.push($(this).text());
            $(this).css('color', 'green');
        });
        
        $('.child').on('click',function(e) {
           if (jQuery.inArray(($(this).parent().parent().parent().children('.btn').text()).toString(), sequence) !='-1') {
               sequence.push($(this).text());
               $(this).css('color', 'green');
           }else{
               alert('Bad Data');
               sequence = [];
               $(this).removeAttr('style');
           }
        });
         
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li><button class="btn parent"><i class="fa faplus"></i>1</button></li>
    <li><button class="btn parent"><i class="fa faplus"></i>2</button></li>
    <li><button class="btn parent"><i class="fa faplus"></i>3</button>
        <ul>
            <li><button class="btn child"><i class="fa faplus"></i>4</button></li>
            <li><button class="btn child"><i class="fa faplus"></i>5</button></li>
        </ul>
    </li>
</ul>

所选ID的顺序

1 个答案: