0

我需要以下代码的帮助。有 2 种样式：activatedRow和disactivatedRow。当用户点击一个按钮（位于表的 TD 内）时，要么 要么activatedRow被disactivatedRow应用到一行。样式的选择基于当前样式。例如，如果激活了一行，则按钮将禁用它，反之亦然。

所以，我有一个问题AJAX success。如何编写 IF 语句来检查行的当前样式？

PS 此外，知道如何更改 TD IMG（按钮）以禁用和激活行也会很有趣。

CSS

.activatedRow td { 
    background-color:#FFFFFF !important;
    color: #000000 !important;
}
.disactivatedRow td { 
    background-color:#DFE1ED !important;
    color: #9896A8 !important;
}

函数“disactivateRow()”

<script type="text/javascript">
function disactivateRow(flightNum,obj){ 
           $.ajax({
                   type: "POST",
                   url: "callpage.php?page=tables/disactivate.php",
                   data: "flightNum=" + flightNum,
                   success: function(){
                       if ($(obj).hasClass("activatedRow")) {
                    $(obj).removeClass("activatedRow").addClass("disactivatedRow");
                } else
                    $(obj).removeClass("disactivatedRow").addClass("activatedRow");
               }
            });
}
</script>

表格内的按钮

            <table id="newspaper-b" border="0" cellspacing="2" cellpadding="2" width = "100%">
                <thead>
                    <tr>
                        <th scope="col">Flt Num</th>
                        <th scope="col"></th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($result1 as $row):
                        $flightNum=$row['flightNum'];
                    ?>
                    <tr id="<?php echo $flightNum; ?>" class="edit_tr">
                        <td><?php echo $flightNum;?></td>
                        <td id="<?php echo $flightNum; ?>">
                             <div onclick='disactivateRow("<?php echo $flightNum; ?>", this)'>
                                <img src='images/disactivate.png' alt='Disactivate' />
                            </div>              
                        </td>
                    </tr>
                    <?php endforeach;?>
                </tbody>
            </table>

jQuery 数据表激活

 $(document).ready(function(){
      $('#newspaper-b').dataTable({
      "sPaginationType":"full_numbers",
      "bJQueryUI":true,
      'fnRowCallback': function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {     
          if (aData[0] == "0") {
                    nRow.className = "disactivatedRow";
              } else
                    nRow.className = "activatedRow"; 
            return nRow;
        }

      });

回答：

它现在有效：

      $(".disact_but" ).click(function() {
            var ID=$(this).attr('id');
                $.ajax({
                       type: "POST",
                       url: "callpage.php?page=tables/disactivate.php",
                       data: "flightNum=" + ID,
                       success: function(){
                            $("#"+ID).toggleClass("disactivatedRow", 100);
                       }
                });
            return false;
      });
4

1 回答 1

0

如果obj是 TD 应用样式，因为您的代码表明您可以使用toggleClass

根据类的存在或 switch 参数的值，从匹配元素集中的每个元素中添加或删除一个或多个类。

$(obj).closest('tr').toggleClass('disactivatedRow');
$(obj).closest('tr').toggleClass('activatedRow');

编辑

根据您添加的新信息，obj是一行的孩子。closest方法应该给你适当的tr然后我们可以申请toggleClass

于 2012-05-27T13:28:21.717 回答