Question

我在标签内有复选框。我需要标签在选中复选框时有一个类，但是当它没有时则不需要。我用它来管理它：

  $('label').click(function(){
    if ($('input[type=checkbox]', this).is(':checked')) {
     $(this).addClass('checked');
    } else {
      $(this).removeClass('checked');
    }
  });

然而，当页面加载时，如果选中了复选框，则标签没有该类，因为代码尚未运行。

我想把代码放在一个函数中然后调用它但是以下方法不起作用。我的代码示例都包含在dom中。

  function checkFunc(){
    if ($('input[type=checkbox]').is(':checked')) {
      $(this).parent('label').addClass('checked');
    } else {
      $(this).parent('label').removeClass('checked');
    }
  }

  checkFunc();
  $('label').click(checkFunc);

我是否遇到语法错误或者我的代码出现了根本错误？

更新我尝试了以下内容：

  function checkFunc(){
    if ($('input[type=checkbox]', this).is(':checked')) { 
      $(this).parent('label').addClass('checked');
    } else {
      $(this).parent('label', this).removeClass('checked');
    }
  }

  $('label').each(checkFunc).click(checkFunc);

Answer 1

当您使用checkFunc()调用该函数时，[this引用window] 1，而不是label元素。

看起来您想在每个标签元素上运行该函数，因此请改用.each：

$('label')
  .each(checkFunc)
  .click(checkFunc);

但是你也可以在绑定后简单地装配click事件处理程序，而不是创建一个命名函数：

$('label').click(function(){
   // ...
}).triggerHandler('click');

在点击和页面加载时运行功能？

1 个答案: