jquery - 如果在 .ready 上选中复选框，则添加Class

Question

我正在加载以前保存的表单，以便使用数据库中保存的值进行编辑。我试图让 jQuery 在页面加载时确定复选框的状态。

这是我所做的:

我加载了保存的值(0 或 1)，然后使用 php 选中该框(如果 value == 1)。

<tr class="line">
  <td class="text-center"><input class="tax" type="checkbox" name="taxable" 
   value="{{$item->taxable}}"  <?php echo ($item->taxable == 1) ? 'checked="checked"' : ''; ?>/
  </td>
</tr>

接下来我尝试使用 jQuery 来查看是否在 document.ready() 上选中了 .tax 复选框，然后将新类添加到行中:

$(document).ready(function(){

if ($('.tax').is(':checked')){
      $(this).closest('tr').addClass("extraClass");
    };
 //more jquery

我的问题:.is(':checked') 会在文档就绪时运行吗？如果没有，在页面加载时查看该框是否被选中的正确方法是什么？

如果该部分正确，那么 $(this).closest('tr') 是将新类添加到行的正确方法吗？

Answer 1

this 不会是 .tax。它将是文档。

你应该说:

$('.tax:checked').closest('tr').addClass('extraClass');

 $('.tax:checked').closest('tr').addClass('extraClass');

.extraClass {
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
  <tr class="line">
    <td class="text-center"><input class="tax" type="checkbox" name="taxable" 
     value="1"  checked="checked"
    </td>
  </tr>
  <tr>
    <td class="text-center"><input class="tax" type="checkbox" name="taxable" 
     value="0"  
    </td>
  </tr>
</table>