Question

表：

<table class="table">
                    <thead>
                        <tr><th></th>
                    </tr></thead>
                    <tbody>

                    <tr class="statusdiv"><td colspan="2" class="location">General<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">New York<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">Florida<span class="continent pull-right">Norte América</span></td><td class="down text-danger text-center"><i class="icon-chat-1"></i></td><td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">Texas<span class="continent pull-right">Norte América</span></td><td class="down text-danger text-center"><i class="icon-chat-1"></i></td><td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">California<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">Georgia<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">México<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">Virginia<span class="continent pull-right">Norte América</span></td><td class="up text-success text-center"><i class="icon-chat-1"></i></td><td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-2"></i></td>
      <td class="up text-success text-center"><i class="icon-chat-1"></i></td></tr><tr class="statusdiv"><td colspan="2" class="location">Illinois<span class="continent pull-right">Norte América</span></td><td class="down text-danger text-center"><i class="icon-chat-1"></i></td><td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-2"></i></td>
      <td class="down text-danger text-center"><i class="icon-chat-1"></i></td></tr> </tbody>
                </table>

Jquery：

jQuery(window).bind("load", function() {
var table = jQuery('#status-table tbody');
jQuery.ajax({
    url: "status.php",
    success: function(){

    },
    error: function (){
        alert("error")
    }
    }).done(function(html){
        table.append(html).queue(function(){
            jQuery('#status-table tbody tr td').each(function() {
                if(jQuery(this).hasClass('up')) {
                    jQuery('#m-hero-status-message').find('h1.m-ok').fadeIn();
                }
            });
        })
});

}）;

我们需要检查所有td是否已经“up”（在tbody中）并且如果是fadein一个div，如果不是所有div的hassclass“up”我们需要做另一个动作。主要的问题是我们制作的代码是如果td hasclass“up”然后它执行动作，这不是我们需要的。

感谢您的帮助。

Answer 1

您可以获取所有TD，然后使用.up类过滤掉所有元素，如果您获得相同数量的元素，则所有元素都具有该类

$(window).on("load", function() {
    var table = $('#status-table tbody');
    $.ajax({
        url: "status.php"
    }).done(function(html) {
        table.append(html);

        var td = table.find('tr td'),
            up = td.filter('.up');

        if ( td.length === up.length ) { // all TD's have the class .up
            $('#m-hero-status-message').find('h1.m-ok').fadeIn();
        }
    }).fail(function(error) { ... });
});

检查所有表td是否具有类，然后执行某些操作

1 个答案: