jQuery toggleClass并选中复选框

我似乎无法让这个工作。 如果我删除脚本的复选框部分，切换类可以工作，但如果我添加它，那么它不再切换该类。 我是一名业余爱好者，所以我非常感谢任何帮助。 我正在使用jQuery版本1.4.1。 谢谢。

$("li.imprint").click(function() { $(this,"li.imprint").toggleClass('selected').children("input[@type=checkbox]")[0].click(); }); 

所以基本上我正在构建一个Web表单供人们自定义笔。 所以他们需要选择他们想要的颜色印记。 我想要展示一个颜色的样本，而不仅仅是一个无聊的颜色列表。 所以我想我会创建一个列表，放一些复选框，这样他们就可以选择颜色并使用CSS来隐藏实际的复选框，这样它就很好又干净。 我看到了为单选按钮完成此操作的代码，我的工作正常。 我试图将它改编为复选框，但问题是你只能选择一个单选按钮而是多个复选框。

给你一个半function的例子。 如果您前往测试网站，它是现场（我不知道这是一个很好的做法），并尝试自定义笔，你可以看到我正在尝试做什么。 Pensfast.com Beta

Answer 1

鉴于您的更新详细信息，这是您想要的：

 $("li.imprint").click(function(){ var $checkbox = $(this).toggleClass('selected').find(':checkbox'); if($(this).hasClass('selected')) { $checkbox.attr('checked','checked'); } else { $checkbox.removeAttr('checked'); } }) 

我担心你的课程不正确。 您在问题中引用了li.imprint ，但我在您网站上访问的页面上有li.Barellimprint类。显然，如果选择器错误，这个答案将不起作用。 尝试将第一行更改为：

 $("li.Barrelimprint").click(function(){ 

这段代码可以在这个页面上运行 。

Answer 2

这对我有用 – 它还可以容纳多个复选框，每个复选框都可以具有不同的初始状态。

CSS：

 .dragable { margin: 4px; border: 1px solid #c6e1ff; line-height: 15px;} .dragable.selected, .dragable.unselected.selected {background: #ebf5ff;} .dragable.unselected {background: #ffffff;} 

HTML：

 
 
 Results
 
 Benefits 
  

Javascript：

希望这可以帮助！

Answer 3

尝试：

 $("li.imprint").click(function() { $(this,"li.imprint").toggleClass('selected') .children("input:checkbox:first").attr('checked',true); }); 

我可以问你为什么要在复选框上点击“点击”？

如果您想选中或取消选中复选框，请阅读此内容 。

更新

试试这个：

 $("li.imprint").click(function() { $(this).toggleClass('selected') $(':checkbox',this).attr('checked',$(this).is('selected')); });