0

嗨，我有几个实例，其中其他开发人员（执行 CSS/HTML）已将一些选项编码为复选框，用户可以单击/点击它们以“检查”它们。

$(document).ready(function() {
  $('.terms input:checkbox').change(function(){
     if($(this).is(":checked")) {
       $(this).parent().toggleClass("checked");
     }
  });
});

这在 Chrome 中运行良好，但在 Firefox 中没有任何作用（OSX 上的最新版本）

有什么理由吗？我在这里做错了什么？

编辑：很抱歉没有提供任何 HTML :-/

 <div class="terms">
   <input type="checkbox" name="terms" value="Acepto las condiciones" />
   <p class="checkbox"></p>
   <p>Acepto las condiciones <a title="Términos y condiciones" href="static.html">?</a></p>
</div>
4

2 回答 2

1

http://jsfiddle.net/gJ9fC/

查询：

$(document).ready(function() {
    $('input:checkbox').change(function() {
       $(this).parent().toggleClass("checked");

  });
});

由于您使用切换，因此您无需检查您的复选框是否被选中。当您使用切换时，jquery 会根据您的要求删除或添加类！

O 和我删除了 .terms 因为你没有它。你可以使用 .subproducts

于 2013-03-12T10:46:34.593 回答
1

通过对 jQuery 进行微小的更改，您就可以实现您想要做的事情。并且不要忘记.checked在您的 css 文件中添加类。

$(document).ready(function() {
  $('.terms input:checkbox').on('change', function(){          
      $(this).parent().toggleClass("checked");   
    });
});

例子

另一个使用label标签的例子。我相信它更方便用户体验。

使用标签的示例

于 2013-03-12T10:47:14.150 回答