jquery - 编写一个新的 jQuery 插件

Question

<table class="data" border="1">
    <tbody>
        <tr>
        </tr>
            <td><input type="checkbox" /></td>

        <tr>
            <td><input type="checkbox" /></td>

        </tr>
        <tr>
            <td><input type="checkbox" /></td>
        </tr>        
    </tbody>
</table>

遍历每个 tr 时元素，检查是否给定 <tr>元素有一个选中的复选框，如果是，则添加新类。如果没有，请将其删除。

jQuery.fn.deleteMark = function() {

   this.each(function() {
        alert( $('input:checkbox',this) );
        if ($('checkbox',this).is(':checked')){
            $(this).addClass("delemarked");
        }
        else{
            $(this).removeClass("delemarked");
        }
   })
};

现在我想为每个 tr 添加一个类已检查:

function refresh(){
    $('.data tbody tr').each(function() {
        $(this).deleteMark();
    });        
}

遗憾的是这对我不起作用。我将不胜感激任何帮助。

Answer 1

而不是 checkbox ，您需要:checkbox对于选择器，因为没有 <checkbox>元素，像这样:

$(':checkbox',this)

尽管您可以使用.toggleClass("className", bool)来缩短您的整体方法，像这样:

jQuery.fn.deleteMark = function() {
  return this.each(function() {
    $(this).toggleClass("delemarked", $(this).find(":checkbox:checked").length > 0);
  });
};

此外，不需要 .each() 调用你的插件，这样就可以了:

$('.data tbody tr').deleteMark();

You can test all of the change above here .